Flutter - изменение стиля текста, пока пользователь нажимает на виджет

У меня есть простой виджет Text, который должен загораться (менять цвет текста и значка, пока пользователь нажимает на него), когда пользователь поднимает вверх, цвет его пальца возвращается к значению по умолчанию. Я знаю, что это как-то связано с GestureDetector, onLongPressStart & onLongPressEnd, но я не могу понять, как именно оттуда идти!

Это виджет:

GestureDetector(
    onLongPressStart: /** change text & icon color */,
    onLongPressEnd: /** revert to default text & icon color */,
    child: Row(
        children: [
            Text("visit us"),
            SizedBox(width: 6.0),
            Icon(FeatherIcons.arrowRightCircle,),
        ],
    ),
),

Как я могу достичь такой логики?


person Thorvald Olavsen    schedule 22.10.2020    source источник


Ответы (2)


class MyWidget extends StatefulWidget {
  MyWidget({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyWidgetState extends State<MyWidget> {

  Color textColor = Colors.black;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: GestureDetector(
         onLongPressStart: (val){
            setState((){
              textColor = Colors.red;
            });
         },
         onLongPressEnd: (val){
           setState((){
              textColor = Colors.black;
            });
          },
         child: Row(
         children: [
            Text("visit us",style:TextStyle(color:textColor)),
            SizedBox(width: 6.0),
          ],
        ),
      ),
    );
  }
}

Когда вы изменяете уже определенную переменную внутри setState, он перестраивает виджет с новым значением, в данном случае это textColor, но у вас может быть много других, подобных этому другому примеру.

Предположим, у нас есть следующие переменные, определенные перед функцией сборки:

Color textColor = Colors.black;
String text = "initial Text";

setState функция будет выглядеть так:

setState((){
  textColor = Colors.red;
  text = "new Text";
});
person man of knowledge    schedule 22.10.2020

не протестировав его, я бы попытался установить переменную на longPressStart и отключить ее на longPressEnd. Тогда дочерний массив строки может быть примерно таким:

if(longPressVariable == true) then return [TextWithStyle1] else return [TextWithStyle2]

person ehhc    schedule 22.10.2020