2017-07-14 14 views
0

フラッタに新しくなっているので、私はそれに取り込もうとしています。しかし、私はそれにExpansionPanelsを持つExpansionPanelListを作成することに掛かっています。そしてタイトルはすべてgoogles Flutterで作成されたように。フラッタに項目を含むExpansionPanelListを作成できない

これまで

マイコード:

import 'package:flutter/material.dart'; 


class ShoppingBasket extends StatefulWidget { 
    @override 
    ShoppingBasketState createState() => new ShoppingBasketState(); 
} 

class ShoppingBasketState extends State<ShoppingBasket> { 

    @override 
    Widget build(BuildContext context) { 
    return new ExpansionPanelList(
     children: <ExpansionPanel>[ 
     new ExpansionPanel(
      headerBuilder: _headerBuilder, 
      body: new Container(
      child: new Text("body"), 
     ), 
     ) 
     ], 
    ); 
    } 


    Widget _headerBuilder(BuildContext context, bool isExpanded) { 
    return new Text("headerBuilder"); 
    } 
} 

しかし、私はアプリを開いたときに、デバッガは言う: もう一つの例外がスローされました:アサーションに失敗しました::「パッケージ:/レンダリング/ box.dartフラッター/ srcに」行1430 pos 12: 'hasSize':は真ではありません。

私は多くのことを検索しかし、私は申し訳ありません自分自身を助ける方法を見つけることができません:)

答えて

1

あなたがListViewColumnまたはそれを強制しませんいくつかの他の容器にあなたのExpansionPanelListを配置する必要がありますようですね特定のサイズにする。

次は、拡張パネルの使用例です。

screenshot

import 'package:flutter/material.dart'; 

class ShoppingBasket extends StatefulWidget { 
    @override 
    ShoppingBasketState createState() => new ShoppingBasketState(); 
} 

class MyItem { 
    MyItem({ this.isExpanded: false, this.header, this.body }); 

    bool isExpanded; 
    final String header; 
    final String body; 
} 

class ShoppingBasketState extends State<ShoppingBasket> { 
    List<MyItem> _items = <MyItem>[ 
    new MyItem(header: 'header', body: 'body') 
    ]; 

    @override 
    Widget build(BuildContext context) { 
    return new ListView(
     children: [ 
     new ExpansionPanelList(
      expansionCallback: (int index, bool isExpanded) { 
      setState(() { 
       _items[index].isExpanded = !_items[index].isExpanded; 
      }); 
      }, 
      children: _items.map((MyItem item) { 
      return new ExpansionPanel(
       headerBuilder: (BuildContext context, bool isExpanded) { 
       return new Text(item.header); 
       }, 
       isExpanded: item.isExpanded, 
       body: new Container(
       child: new Text("body"), 
      ), 
      ); 
      }).toList(), 
     ), 
     ], 
    ); 
    } 
} 

void main() { 
    runApp(new MaterialApp(
    home: new Scaffold(
     appBar: new AppBar(
     title: new Text('ExpansionPanel Example'), 
    ), 
     body: new ShoppingBasket(), 
    ), 
)); 
} 

ザ・フラッターギャラリーでは、より詳細なexpansion panels exampleを持っています。

+0

ありがとうございます:) –

関連する問題