GestureDetector и обработка нажатий

Последнее обновление: 06.02.2021

Во Flutter мы можем добавить возможность обработки нажатию для другого виджета. Для этого применяется класс GestureDetector.

Конструктор данного класса содержит много параметров, поэтому рассмотрим наиболее основные. В частности, параметр child позволяет установить вложенный виджет, для которого добавляется возможность нажатия. Если GestureDetector не имеет вложенного виджета, то он занимает все пространство своего родительского контейнера, делая всю его площадь кликабельной.

Для обработки все возможных нажатий конструктор GestureDetector предоставляет различные параметры. Действие для простого нажатия можно задать с помощью параметра onTap.

Например, сделаем с помощью GestureDetector кликабельным виджет Container:

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
      home:  Scaffold(
        body: Counter(),
        appBar: AppBar(title: Text("METANIT.COM")),)
  ));
}
class Counter extends StatefulWidget{

  Counter({ Key key}) : super(key: key);
  @override
  _CounterState createState() => _CounterState();
}
class _CounterState extends State<Counter>{

  int _value = 0;

  _increaseValue(){
    setState(() =>_value++);
  }
  @override
  Widget build(BuildContext context) {

    return GestureDetector(
      onTap: _increaseValue,
      child: Container(
        color: Colors.lightBlueAccent,
        padding: const EdgeInsets.all(10),
        margin: const EdgeInsets.all(10),
        child: Text("Value: $_value", style: TextStyle(fontSize: 22)),
      ),
    );
  }
}

В данном случае параметр класса onTap указывает на метод _increaseValue(), который изменяет состояние виджета Counter. В частности, увеличивает значение переменной _value на единицу.

Вложенным виджетом для GestureDetector является на элемент Container, который, в свою очередь, содержит виджет Text. А Text выводит значение переменной _value. То есть по нажатию на область, занимаемую виджетом Container, будет срабатывает метод _increaseValue().

Виджет GestureDetector и обработка нажатий в Flutter

Подобным образом можно добавить нажатия и к другим виджетами с более сложной иерархией или создать собственные виджеты, которые поддерживают обработку нажатий.

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850