Как изменить цвет заголовка расширения, когда оно развернуто? - PullRequest
Новая
       70

Как изменить цвет заголовка расширения, когда оно развернуто?

1 голос
/ 10 июля 2020

Я новичок во флаттере, я хочу изменить цвет заголовка расширения, когда он расширен, по умолчанию теперь синий, теперь я хочу изменить, когда мой цвет заголовка расширения, когда он развернулся, вот мой код, пожалуйста, проверьте, он меняет только цвет заголовка, любой здесь, кто может помочь мне? `

 `Padding(
                        padding: EdgeInsets.only(left: 30),
                        child: ExpansionTile(
    
                            children: <Widget>[
                              Text(
                                  '
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sollicitudin nulla risus, vel molestie quam mattis vitae. Quisque in neque in libero hendrerit ultricies a vel purus. Ut iaculis hendrerit nibh, nec pulvinar quam condimentum in. Fusce mollis elit vel lectus venenatis, sagittis sollicitudin lorem tristique. Quisque mattis vel dolor eget dictum. Integer facilisis tortor non lectus ullamcorpe'.',style: TextStyle(
                                  
                              fontSize: 14,  
                            fontFamily: 'Avenir LT 55 Roman',
                    
                                  ),)
                            ],
                            title: Row(
                              children: <Widget>[
                                Image.asset(
                                  'images/online.png',
                                ),
                                GestureDetector(
                                  onTap: () {
                                    Navigator.push(
                                      context,
                                      MaterialPageRoute(
                                          builder: (context) => Online()),
                                    );
                                  },
                                  child: Text(
    
                                    'Online Giving',
                                    style: TextStyle(
    
    
                                      fontSize: 20,
                                        fontFamily: 'TT NORMS',
                                      fontWeight: FontWeight.bold,
    
    
                                    ),
    
    
                                  ),
    
                                )
    
                              ],
    
    
                            )),
    
                      ),

1 Ответ

1 голос
/ 10 июля 2020

Чтобы дать решение вашей проблемы, вам необходимо знать, как используются statefulWidget и StatelessWidget. вам нужно использовать класс StatefulWidget, когда ваш встроенный виджет имеет локальные изменения, такие как собственный цвет текста ... ext вам нужен класс StatelessWidget, когда ваш виджет сборки не имеет локальных изменений (вы делаете это самостоятельно). Итак, в вашем коде у вас есть простое дерево виджетов, которое состоит из: Scaffold -> ListView -> [Tile1,Tile2... TileN]. Эшафот ListView не нуждается в локальных изменениях, поэтому мы делаем их StatelessWidget. 

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: [
          // each tile need her own state management since it depends on a setstate method
          CustomExpensionTile(),
          CustomExpensionTile(),
          CustomExpensionTile(),
        ],
      ),
    );
  }
}

Но плитки списка нуждаются в локальных изменениях, таких как цвет текста в вашем примере, но вы хотите, чтобы только один из них изменился при расширении. поэтому поместите их в отдельные виджеты. 

  @override
  _CustomExpensionTileState createState() => _CustomExpensionTileState();
}

class _CustomExpensionTileState extends State<CustomExpensionTile> {
  bool _isExpanded;
  @override
  Widget build(BuildContext context) {
    return ExpansionTile(
      backgroundColor: Colors.transparent,
      title: Text(
        "test",
        style: TextStyle(
          color: _isExpanded ? Colors.red : Colors.black,
        ),
      ),
      onExpansionChanged: (value) {
        _isExpanded = value;
        // whene setState methode is called the widget build function will be replayed with the new changes that we've done
        setState(() {});
      },
    );
  }
}

, и мы вызываем setState для события ExpansionChanges, чтобы изменения произошли. подробнее go на https://flutter.dev/

...