flutter Listview、 跳转(二)

运行编写了一个listview代码简易的很(对着练),继承StatefulWidget(动态变化)方法

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';

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

class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
        return new MaterialApp (
            title : 'Welcome',
            home : new RandomWords(),
        );
    }
}

class RandomWords extends StatefulWidget {
    @override
    createState() => new RandomWordsState();
}

class RandomWordsState extends State <RandomWords> {
    @override
    final _suggestions = <WordPair>[];
    final _saved = new Set<WordPair>();
    final _biggerFont = const TextStyle(fontSize : 18.0);
    Widget build(BuildContext context) {
        return new Scaffold(
            appBar: new AppBar(title: new Text('ListView')),
            body: _buildSuggestions(),
            );
    }
    Widget _buildSuggestions() {
        return new ListView.builder(
            padding : const EdgeInsets.all(16.0),
            itemBuilder : (context, i){
                if (i.isOdd) return new Divider();

                final index = i ~/ 2;
                if (index >= _suggestions.length) {
                    _suggestions.addAll(generateWordPairs().take(10));
                }
                return _buildRow(_suggestions[index]);
            }
        );
    }
    Widget _buildRow(WordPair pair) {
        final alreadySaved = _saved.contains(pair);
        return new ListTile(
            title : new Text(
                pair.asPascalCase,
                style: _biggerFont,
            ),
            trailing: new Icon(
                alreadySaved ? Icons.favorite : Icons.favorite_border,
                color: alreadySaved ? Colors.red : null,
            ),
            onTap: (){
                setState((){
                    if (alreadySaved) {
                        _saved.remove(pair);
                    } else {
                        _saved.add(pair);
                    }
                });
            },
        );
    }
}

跳转页面是经过路由进行跳转:

 点击事件  onPressed
跳转:Navigator.of(context).push();

跳转代码 替换build:

@override
  Widget build(BuildContext context) {
    return  Scaffold(
      appBar:  AppBar(
        title: const Text('Startup Name Generator'),
        actions: <Widget>[
           IconButton(icon: const Icon(Icons.list), onPressed: _pushSaved),
        ],
      ),
      body: _buildSuggestions(),
    );
  }

_pushSaved方法:

void _pushSaved() {
    Navigator.of(context).push(
       MaterialPageRoute<void>(
        builder: (BuildContext context) {
          final Iterable<ListTile> tiles = _saved.map(
                (WordPair pair) {
              return  ListTile(
                title:  Text(
                  pair.asPascalCase,
                  style: _biggerFont,
                ),
              );
            },
          );
          final List<Widget> divided = ListTile
              .divideTiles(
            context: context,
            tiles: tiles,
          )
              .toList();
          return  Scaffold(
            appBar:  AppBar(
              title: const Text('Saved Suggestions'),
            ),
            body:  ListView(children: divided),
          );
        },
      ),
    );
  }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容