当前位置:  开发笔记 > 编程语言 > 正文

Flutter扩展图块-标头颜色更改和尾随动画箭头颜色更改

如何解决《Flutter扩展图块-标头颜色更改和尾随动画箭头颜色更改》经验,为你挑选了1个好方法。

我已使用扩展图块生成扩展列表视图。我在扩展图块头中遇到一些自定义问题。

下面是我的代码。

ExpansionTile(           
    title: Container(
        child: Text(
            getCategory(i),
            style: TextStyle(
            color: Colors.white,
            ),
        ),
        color: Colors.black
    ),

    children: [
        new Container(
            height: 60.0,
            margin: const EdgeInsets.only(top:10.0, left: 10.0, right:10.0, bottom: 10.0),
            decoration: BoxDecoration(                    
            color: Colors.blue,
            borderRadius: new BorderRadius.all(  Radius.circular(5.0) ),
            ),
        ),
        new Container(
            height: 60.0,
            margin: const EdgeInsets.only(top:10.0, left: 10.0, right:10.0, bottom: 0.0),
            decoration: BoxDecoration(                    
            color: Colors.green,
            borderRadius: new BorderRadius.all(  Radius.circular(5.0) ),
            ),
        )
    ],
    backgroundColor: Colors.white,
)

我的成绩低于预期。

我期望的是下面。

如果有人知道自定义标题颜色的解决方法,请提出建议。



1> diegoveloper..:

如果检查ExpansionTitle的源代码,您会注意到标题项是ListTile,因此您不能更改背景,因为它没有具有color属性的父项。我对课程进行了一些修改以支持您的需求。

将此文件添加到您的项目中:https : //gist.github.com/diegoveloper/02424eebd4d6e06ae649b31e4ebcf53c

并以这种方式导入以避免名称冲突。

    import 'package:nameofyourapp/custom_expansion_tile.dart' as custom;

我将别名设置为“ custom”,但您可以更改任何别名。

用法:

    custom.ExpansionTile(
              headerBackgroundColor: Colors.black,
              iconColor: Colors.white,
              title: Container(
              ...

记住,Flutter开箱即用的有很多小部件,但是如果其中任何一个都不符合您的需求,则必须检查源代码并创建自己的小部件。

推荐阅读
Life一切安好
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有