Skip to content

Commit 8556294

Browse files
update
1 parent c162eb9 commit 8556294

File tree

5 files changed

+527
-0
lines changed

5 files changed

+527
-0
lines changed

TextFieldDemo.dart

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
import 'package:flutter/material.dart';
2+
3+
//void main() {
4+
// runApp(new MyApp());
5+
//}
6+
//
7+
//class MyApp extends StatelessWidget {
8+
// @override
9+
// Widget build(BuildContext context) {
10+
// return new MaterialApp(
11+
// title: 'TextFieldDemo',
12+
// theme: new ThemeData(
13+
// primarySwatch: Colors.blue, //蓝色主题
14+
// ),
15+
// //主要内容是什么。。。
16+
// home: new TextFieldDemo(),
17+
// );
18+
// }
19+
//}
20+
// //TextField基本使用
21+
//class TextFieldDemo extends StatelessWidget {
22+
// @override
23+
// Widget build(BuildContext context) {
24+
// return new Scaffold(
25+
// appBar: new AppBar(
26+
// title: new Text('TextFieldDemo'),
27+
// centerTitle: true,
28+
// ),
29+
// body: new Container(
30+
// padding: new EdgeInsets.all(5.0),
31+
// child: new ListView(
32+
// children: <Widget>[
33+
// new Text(
34+
// '请输入用户名1',
35+
// style: new TextStyle(fontSize: 15.0, color: Colors.teal),
36+
// ),
37+
// buildTextField(maxLength: 30),
38+
// new Text(
39+
// '请输入密码1',
40+
// style: new TextStyle(fontSize: 15.0, color: Colors.teal),
41+
// ),
42+
// buildTextField(
43+
// obscureText: true, maxLength: 16, maxLengthEnforced: true),
44+
// new Text(
45+
// '请输入用户名2',
46+
// style: new TextStyle(fontSize: 15.0, color: Colors.teal),
47+
// ),
48+
// buildTextField(),
49+
// new Text(
50+
// '请输入密码2',
51+
// style: new TextStyle(fontSize: 15.0, color: Colors.teal),
52+
// ),
53+
// buildTextField(
54+
// obscureText: true, maxLength: 16, maxLengthEnforced: false),
55+
// ],
56+
// ),
57+
// ),
58+
// );
59+
// }
60+
//}
61+
//
62+
//Widget buildTextField(
63+
// {bool obscureText = false, int maxLength, bool maxLengthEnforced = false}) {
64+
// return new TextField(
65+
//// decoration: new InputDecoration(),
66+
//// focusNode:,
67+
//// 处理交互操作的
68+
//// controller:,
69+
//// keyboardType: TextInputType.text,
70+
// style: new TextStyle(color: Colors.teal),
71+
// textAlign: TextAlign.start,
72+
// autofocus: true,
73+
// //是否加黑点隐藏输入字符 false为显示所有字符 true隐藏字符
74+
// obscureText: obscureText,
75+
// //自动更正
76+
// autocorrect: true,
77+
// maxLines: 1,
78+
// maxLength: maxLength,
79+
// // 如果为true,则阻止字段允许超过[maxLength]个字符。
80+
// maxLengthEnforced: maxLengthEnforced,
81+
//
82+
// ///可选的输入验证和格式化重写。
83+
// ///格式器在文本输入发生变化时按照所提供的顺序运行。
84+
//// inputFormatters:,
85+
//// 如果为false,则文本字段为“禁用”:它将忽略点击并将其decoration置为灰色
86+
// enabled: true,
87+
// onChanged: (String) {
88+
// print('onChanged ==> ' + String);
89+
// },
90+
// onSubmitted: (String) {
91+
// print('onSubmitted ==> ' + String);
92+
// },
93+
// );
94+
//}
95+
96+
//带交互效果的Form + TextFormField
97+
void main() {
98+
runApp(new MaterialApp(
99+
title: 'FieldDemo',
100+
theme: new ThemeData(
101+
primarySwatch: Colors.blue,
102+
),
103+
home: new FieldDemo(),
104+
));
105+
}
106+
107+
class FieldDemo extends StatefulWidget {
108+
@override
109+
_FieldDemoState createState() => new _FieldDemoState();
110+
}
111+
112+
class _FieldDemoState extends State<FieldDemo> {
113+
GlobalKey<FormState> _formKey = new GlobalKey<FormState>();
114+
String _name;
115+
String _color;
116+
String _config;
117+
118+
@override
119+
Widget build(BuildContext context) {
120+
return new Scaffold(
121+
appBar: new AppBar(
122+
title: new Text('新增商品'),
123+
),
124+
body: new ListView(
125+
children: <Widget>[
126+
new Padding(
127+
padding: const EdgeInsets.all(8.0),
128+
child: new Form(
129+
key: _formKey,
130+
child: new Column(
131+
children: <Widget>[
132+
new TextFormField(
133+
onSaved: (val) => this._name = val,
134+
validator: (val) =>
135+
(val == null || val.isEmpty) ? "请输入商品名称" : null,
136+
decoration: new InputDecoration(
137+
labelText: '商品名称',
138+
),
139+
),
140+
new TextFormField(
141+
maxLength: 32, //文本长度
142+
onSaved: (val) => this._color = val,
143+
validator: (v) => (v == null || v.isEmpty) ? "请选择颜色" : null,
144+
decoration: new InputDecoration(
145+
labelText: '颜色',
146+
),
147+
),
148+
new TextFormField(
149+
maxLength: 32,
150+
onSaved: (val) => this._config = val,
151+
validator: (v) => (v == null || v.isEmpty) ? "请选择配置" : null,
152+
decoration: new InputDecoration(
153+
labelText: '配置',
154+
),
155+
),
156+
new MaterialButton(
157+
child: new Text(
158+
'Submit',
159+
style: const TextStyle(color: Colors.white),
160+
),
161+
onPressed: _onSubmit,
162+
color: Theme.of(context).primaryColor,
163+
)
164+
],
165+
),
166+
),
167+
),
168+
],
169+
),
170+
);
171+
}
172+
173+
void _onSubmit() {
174+
final form = _formKey.currentState;
175+
if (form.validate()) {
176+
form.save();
177+
showDialog(
178+
context: context,
179+
builder: (ctx) => new AlertDialog(
180+
content: new Text('商品名称:$_name \n 颜色:$_color \n 配置:$_config'),
181+
),
182+
);
183+
}
184+
}
185+
}
Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
import 'package:flutter/material.dart';
2+
3+
void main() {
4+
runApp(new MyApp());
5+
}
6+
7+
class MyApp extends StatelessWidget {
8+
@override
9+
Widget build(BuildContext context) {
10+
return new MaterialApp(
11+
title: 'main3',
12+
theme: new ThemeData(
13+
primarySwatch: Colors.blue, //蓝色主题
14+
),
15+
//主要内容是什么。。。
16+
home: new ChipsDemo(),
17+
);
18+
}
19+
}
20+
21+
class ChipsDemo extends StatelessWidget {
22+
@override
23+
Widget build(BuildContext context) {
24+
return new Scaffold(
25+
appBar: new AppBar(
26+
title: new Text('标题'),
27+
centerTitle: true,
28+
),
29+
body: new Column(
30+
children: <Widget>[
31+
buildChoiceChip(),
32+
buildActionChip(),
33+
buildFilterChip(),
34+
buildChip(),
35+
buildInputChip(),
36+
buildRawChip(),
37+
],
38+
),
39+
);
40+
}
41+
}
42+
43+
Widget buildChoiceChip() {
44+
return new ChoiceChip(
45+
label: new Container(
46+
width: 130.0,
47+
child: new Row(
48+
children: <Widget>[
49+
new Text(
50+
'ChoiceChip示例',
51+
style: new TextStyle(color: Colors.white),
52+
),
53+
new SizedBox(
54+
width: 5.0,
55+
),
56+
new CircleAvatar(
57+
backgroundColor: Colors.grey,
58+
radius: 10.0,
59+
child: new Icon(
60+
Icons.close,
61+
color: Colors.white,
62+
size: 10.0,
63+
),
64+
),
65+
],
66+
),
67+
),
68+
// labelStyle: new TextStyle(color: Colors.white),
69+
avatar: new CircleAvatar(
70+
backgroundColor: Colors.deepOrange,
71+
child: new Text('哈'),
72+
),
73+
selected: true,
74+
onSelected: (bool) {
75+
print('点击了ChoiceChip');
76+
},
77+
selectedColor: Colors.blue,
78+
);
79+
}
80+
81+
Widget buildActionChip() {
82+
return new ActionChip(
83+
label: new Text('ActionChip示例'),
84+
avatar: new CircleAvatar(
85+
backgroundColor: Colors.deepPurpleAccent,
86+
child: new Text('哈'),
87+
),
88+
onPressed: () {
89+
print('选择了XXX');
90+
});
91+
}
92+
93+
Widget buildFilterChip() {
94+
return new FilterChip(
95+
label: new Text('FilterChip示例'),
96+
avatar: new CircleAvatar(
97+
backgroundColor: Colors.lime,
98+
child: new Text('哈'),
99+
),
100+
onSelected: (bool) {
101+
print(bool);
102+
});
103+
}
104+
105+
Widget buildChip() {
106+
return new Chip(
107+
label: new Text('Chip示例'),
108+
avatar: new CircleAvatar(
109+
backgroundColor: Colors.teal,
110+
child: new Text('哈哈'),
111+
),
112+
);
113+
}
114+
115+
Widget buildInputChip() {
116+
return new InputChip(
117+
label: new Text('InputChip示例'),
118+
avatar: new CircleAvatar(
119+
backgroundColor: Colors.tealAccent,
120+
child: new Text('哈'),
121+
),
122+
);
123+
}
124+
125+
Widget buildRawChip() {
126+
return new RawChip(
127+
label: new Text('RawChip示例'),
128+
avatar: new CircleAvatar(
129+
backgroundColor: Colors.pinkAccent,
130+
child: new Text('哈'),
131+
),
132+
);
133+
}

0 commit comments

Comments
 (0)