FlutterでTextSwitcherを実装する

Question

FlutterでTextSwitcherが見つかりませんでした。 Androidでは、TextSwitcherはアニメーションのフェードアウト/フェードを追加したテキストを切り替えます。それがFlutterに実装されていますか？私は一からそれを行う必要がありますか？もしそうなら、あなたはそれをどのように実装しますか？ここで

は参照です： https://developer.android.com/reference/android/widget/TextSwitcher.html

Answer 1

フラッターのPageViewクラスは、Android TextSwitcherとほぼ同じ機能を提供します。

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(), 
    ), 
    ); 
    } 
}