我在Flutter上没有找到任何TextSwitcher。在Android上,TextSwitcher切换带有动画淡入淡出功能的文本。在Flutter上有实现吗?我需要从头开始吗?如果是这样,您将如何实现?

这里是引用:
https://developer.android.com/reference/android/widget/TextSwitcher.html

最佳答案

Flutter的 PageView 类提供与Android TextSwitcher大致相同的功能。

text - 在Flutter上实现TextSwitcher-LMLPHP

import 'dart:collection';
import 'package:flutter/scheduler.dart';
import 'package:flutter/material.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_database/firebase_database.dart';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter/foundation.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.orange,
      ),
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  State createState() => new MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {

  PageController _controller = new PageController();

  static const List<String> _kStrings = const <String>[
    'What is your name?',
    'I am a developer.',
    'What are you doing?',
    'Etc. etc...',
  ];

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Text Switcher Demo'),
      ),
      floatingActionButton: new FloatingActionButton(
        child: new Icon(Icons.navigate_next),
        onPressed: () {
          Duration duration = const Duration(milliseconds: 300);
          Curve curve = Curves.easeOut;
          if (_controller.page == _kStrings.length - 1) {
            _controller.animateToPage(0, duration: duration, curve: curve);
          } else {
            _controller.nextPage(duration: duration, curve: curve);
          }
        },
      ),
      body: new PageView(
        controller: _controller,
        children: _kStrings.map((text) {
          return new Center(
            child: new Text(
              text,
              textAlign: TextAlign.center,
              style: Theme.of(context).textTheme.display2
            ),
          );
        }).toList(),
      ),
    );
  }
}

09-27 04:18