主题数据不适用于继承的类

时间:2019-11-14 21:11:29

标签: flutter dart

我已经在main.dart中声明了一个主题,并且只要在main.dart中使用了上下文,它就可以正常工作,但是当我在子类上下文中使用Theme.of(context).primaryColor时,它不会拾取主题。

Main.dart

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Expenso',
      theme: ThemeData(
        primarySwatch: Colors.green,
        accentColor: Colors.amber
      ),
      home: Expenso(),

    );
  }
}

class Expenso extends StatefulWidget {
  @override
  _ExpensoState createState() => _ExpensoState();
}

class _ExpensoState extends State<Expenso> {

  final List<Transaction> _transactions=[

  ];

  void _addTransaction(String txTitle,double txAmount)
  {
    final newTx=Transaction(
      title: txTitle,
      amount: txAmount,
      id: DateTime.now().toString(),
      date: DateTime.now()
    );

    setState(() {
      _transactions.add(newTx);
    });
  }

  void _startAddNewTransaction(BuildContext ctx) {
    showModalBottomSheet(
      context: ctx,
      builder: (_) {

        return GestureDetector(
          onTap: () {},
          child: NewTransaction(_addTransaction),
          behavior: HitTestBehavior.opaque,
        );
      },
    );
  }

 @override
  Widget build(BuildContext context) {
    return MaterialApp(

      home: Scaffold(
        appBar: AppBar(
          backgroundColor:Theme.of(context).primaryColor,
          title: Text('Expenso'),
          actions: <Widget>[
            IconButton(
              icon: Icon(Icons.add),
              onPressed: () => _startAddNewTransaction(context),
            )
          ],
          ),
        body:SingleChildScrollView(
        child: Column(
          //mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
             Container(
                width: double.infinity,
                height: 50,
             child: Card(
                color: Colors.blue,
                child: Text('chart')
                )
                ),
              TransactionList(_transactions)
          ],
        ),     

      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed:() => _startAddNewTransaction(context),
        backgroundColor: Theme.of(context).accentColor,
      ),
      )
    );
  }
}

transaction_list.dart

import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import '../models/transaction.dart';


class TransactionList extends StatelessWidget {
 final List<Transaction> tractn;

 TransactionList(this.tractn);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 500,
    child :tractn.isEmpty? Column(
      children: <Widget>[
        Text('No Transaction added yet'),
        SizedBox(
          height: 20,
        ),
        Container(
          height:300,
          child: Image.asset('assets/Images/waiting.png',
          fit: BoxFit.cover,),

          )
      ],
    ): ListView.builder(
      itemBuilder: (ctx,index){
        return Card(
                  child: Row(
                    children: <Widget>[
                      Container(
                        margin: EdgeInsets.symmetric(
                          vertical: 10,
                          horizontal: 15,  
                              ),
                        decoration: BoxDecoration(border: Border.all(
                          color: Theme.of(context).primaryColor,
                          width: 2,
                          style: BorderStyle.solid
                        )
                        ),
                        padding: EdgeInsets.all(10),
                        child: Text(
                          '₹ ${tractn[index].amount.toStringAsFixed(2)}',
                          style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontStyle: FontStyle.italic ,
                              fontSize: 20,
                              color: Colors.green,                             
                          ),
                          ),

                          ),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                         Text(
                            tractn[index].title,
                            style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 15,
                              color: Theme.of(context).primaryColor
                              ),
                              ),
                              Text(
                               DateFormat().format(tractn[index].date) ,
                               style: TextStyle(
                                 fontWeight: FontWeight.bold,
                                 fontSize: 15,
                                 color: Colors.grey
                               ),),
                               Text(
                                tractn[index].id
                               )                                                    
                        ],
                      )
                    ],
                  ),
                );
      },
      itemCount: tractn.length,
    )

            );

  }
}

请指导我在继承的类中实现主题的方法

2 个答案:

答案 0 :(得分:1)

在Expenso小部件的build方法中,定义另一个MaterialApp,它创建自己的默认主题(与第一个主题不同)。删除该MaterialApp小部件,它应该可以工作。

答案 1 :(得分:1)

我同意@Nolence评论。

如果您希望获得以下结果

resutl

删除 MaterialApp 小部件,并将 Scaffold 作为您的灵长类动物返回小部件

  

_ExpensoState类

示例代码:

select ( len(v.val) - len(replace(v.val, 'aodata.id')) ) / len('aodata.id) as num_aodata_id
from t cross apply
     (values (convert(varchar(max), t.value)) v(val)

如果这不是您想要的,请在下面详细说明您的问题或评论。