flutter源码之GestureDetector demo
2019-02-16 本文已影响65人
iCloudEnd
GestureDetector 详细介绍请参考之前的文章《flutter深入研究之GestureDetector》
GestureDetetor 简介
GestureDetector 是检测手势的widget。如果GestureDetector 的child属性不空,GestureDetector将自己大小设置为child的大小。如果child属性为空,它将自己的大小设置为父组件的大小。
Demo功能规划
有个Image组件,计划给Image组件增加点击事件

Demo源码
初始化项目
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
// TODO 初始化是代码
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('基础 应用'),
),
body:
//TODO step01 add SingleChildScrollView
SingleChildScrollView(
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
//TODO 计划让Image响应点击
new Image.asset(
'assets/images/gugong.jpg',
fit:BoxFit.fill,
width: 100.0,
height: 100.0,
),
RaisedButton(
child: const Text('测试按钮'),
onPressed: (){
print("点击了一下");
},
)
],
),
),
)
),
);
}
}
运行效果
