Cách kích hoạt nút bấm trong Flutter

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách mô phỏng hoặc kích hoạt các cử chỉ như nhấp, nhấn nút, nhấn nút hoặc nhấn nút trong Flutter. Bạn sẽ học cách tạo một nút bấm tự động với ví dụ này. Xem các mã dưới đây:

Bước 1: Đặt Key cho Button:

Trước tiên, bạn cần đặt khóa chung cho nút hoặc bất kỳ tiện ích con nào khác mà bạn muốn mô phỏng cử chỉ nhấn nút.

final mybuttonkey = GlobalKey();

ElevatedButton(
  key:mybuttonkey,
  onPressed: (){
    print("Button is pressed");
  },
  child: Text("My Button"),
)

Bước 2: Lấy vị trí X, Y của Button:

Đây là cách để lấy vị trí x và y của các nút hoặc bất kỳ tiện ích con nào trong Flutter.

RenderBox renderbox = mybuttonkey.currentContext!.findRenderObject() as RenderBox;
Offset position = renderbox.localToGlobal(Offset.zero);
double x = position.dx;
double y = position.dy;

print(x);
print(y);

Bước 3: Kích hoạt Nút Xuống và Nút Lên (Nhấn):

Sử dụng GestureBinding(), bạn có thể kích hoạt bất kỳ sự kiện nhấp chuột nào ở độ lệch tọa độ x và y nhất định. 

import 'package:flutter/gestures.dart';

GestureBinding.instance.handlePointerEvent(PointerDownEvent(
  position: Offset(x, y),
)); //trigger button up,

await Future.delayed(Duration(milliseconds: 500));
//add delay between up and down button

GestureBinding.instance.handlePointerEvent(PointerUpEvent(
  position: Offset(x, y),
)); //trigger button down

Mã đầy đủ Ví dụ:

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';

void main(){
  runApp(MyApp());
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatefulWidget{
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {

    final mybuttonkey = GlobalKey();

    return  Scaffold(
      appBar: AppBar( 
          title: Text("Trigger Button Click"),
          backgroundColor: Colors.deepPurpleAccent,
      ),
      body: Container(
        padding: EdgeInsets.all(20),
        alignment: Alignment.topCenter,
        child:Column(
          children: [
              //button A
              ElevatedButton(
                key:mybuttonkey,
                onPressed: (){
                  print("Button is pressed");
                },
                child: Text("My Button"),
              ),

               //Button B
               ElevatedButton(
                onPressed: () async {
                  
                    RenderBox renderbox = mybuttonkey.currentContext!.findRenderObject() as RenderBox;
                    Offset position = renderbox.localToGlobal(Offset.zero);
                    double x = position.dx;
                    double y = position.dy;

                    print(x);
                    print(y);


                    GestureBinding.instance.handlePointerEvent(PointerDownEvent(
                      position: Offset(x, y),
                    )); //trigger button up,

                    await Future.delayed(Duration(milliseconds: 500));
                    //add delay between up and down button

                    GestureBinding.instance.handlePointerEvent(PointerUpEvent(
                      position: Offset(x, y),
                    )); //trigger button down


                }, 
                child: Text("Trigger Cick Button A")
              )
          ]
        )
      ),
    );
  }
}

Đầu ra:

Tại đây, khi người dùng nhấn nút dưới, nút trên sẽ được kích hoạt nút nhấn, đầu ra GIF được hiển thị ở trên trong bài viết này.

Mã hóa vui vẻ !!!