xt / Flutter-ReserveApp · Commits

Go to a project

Commit c949fb6deeb629fd3aac9db89afb5734c8723c49

Authored by wdn127929
1 parent 16d37715
build: skipped

首页形象UI

Inline Side-by-side
Showing 3 changed files with 158 additions and 6 deletions
@@ -3,4 +3,6 @@ import 'package:flutter/material.dart'; @@ -3,4 +3,6 @@ import 'package:flutter/material.dart';
3 class ThemeColorModel { 3 class ThemeColorModel {
4 String name; 4 String name;
5 Color color; 5 Color color;
  6 + Gradient gradient; //标题
  7 + Gradient gradientSub; //店铺slogan
6 } 8 }
@@ -27,6 +27,12 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -27,6 +27,12 @@ class _FirstImagePageState extends State<FirstImagePage> {
27 List<ThemeColorModel> themeColorData = []; 27 List<ThemeColorModel> themeColorData = [];
28 int themeColorIndex = 0; 28 int themeColorIndex = 0;
29 29
  30 + TextEditingController titleC = TextEditingController();
  31 + FocusNode titleNode = FocusNode();
  32 +
  33 + TextEditingController sloganC = TextEditingController();
  34 + FocusNode sloganNode = FocusNode();
  35 +
30 @override 36 @override
31 void initState() { 37 void initState() {
32 super.initState(); 38 super.initState();
@@ -39,16 +45,48 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -39,16 +45,48 @@ class _FirstImagePageState extends State<FirstImagePage> {
39 ThemeColorModel colorModel = ThemeColorModel(); 45 ThemeColorModel colorModel = ThemeColorModel();
40 colorModel.name = '睿智黑'; 46 colorModel.name = '睿智黑';
41 colorModel.color = MyColours.color_0C0F0E; 47 colorModel.color = MyColours.color_0C0F0E;
  48 + colorModel.gradient = LinearGradient(
  49 + stops: [0, 1],
  50 + colors: [
  51 + // Color.fromARGB(67, 59, 206, 224),
  52 + // Color.fromRGBO(67, 85, 250, 162),
  53 + MyColours.color_0C0F0E,
  54 + MyColours.color_C76216,
  55 + ],
  56 + // begin: Alignment(0, 0),
  57 + // end: Alignment(2, 2),
  58 + begin: Alignment.bottomCenter,
  59 + end: Alignment.topCenter,
  60 + );
  61 + colorModel.gradientSub = LinearGradient(
  62 + stops: [0.2, 1.24],
  63 + colors: [
  64 + // Color.fromARGB(67, 59, 206, 224),
  65 + // Color.fromRGBO(67, 85, 250, 162),
  66 + MyColours.color_0C0F0E,
  67 + MyColours.color_EEAE74,
  68 + ],
  69 + begin: Alignment.bottomCenter,
  70 + end: Alignment.topCenter,
  71 + );
42 themeColorData.add(colorModel); 72 themeColorData.add(colorModel);
43 73
44 ThemeColorModel colorModel1 = ThemeColorModel(); 74 ThemeColorModel colorModel1 = ThemeColorModel();
45 colorModel1.name = '孔雀蓝'; 75 colorModel1.name = '孔雀蓝';
46 colorModel1.color = MyColours.color_0143A3; 76 colorModel1.color = MyColours.color_0143A3;
  77 + colorModel1.gradient = LinearGradient(colors: [
  78 + Colors.red,
  79 + Colors.yellow,
  80 + ]);
47 themeColorData.add(colorModel1); 81 themeColorData.add(colorModel1);
48 82
49 ThemeColorModel colorModel2 = ThemeColorModel(); 83 ThemeColorModel colorModel2 = ThemeColorModel();
50 colorModel2.name = '群青绿'; 84 colorModel2.name = '群青绿';
51 colorModel2.color = MyColours.color_438E93; 85 colorModel2.color = MyColours.color_438E93;
  86 + colorModel2.gradient = LinearGradient(colors: [
  87 + Colors.red,
  88 + Colors.yellow,
  89 + ]);
52 themeColorData.add(colorModel2); 90 themeColorData.add(colorModel2);
53 } 91 }
54 92
@@ -92,6 +130,7 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -92,6 +130,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
92 130
93 @override 131 @override
94 Widget build(BuildContext context) { 132 Widget build(BuildContext context) {
  133 + ThemeColorModel themeColerModel = themeColorData[themeColorIndex];
95 return Scaffold( 134 return Scaffold(
96 backgroundColor: MyColours.color_ffffff, 135 backgroundColor: MyColours.color_ffffff,
97 appBar: SystemAppBar( 136 appBar: SystemAppBar(
@@ -106,8 +145,7 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -106,8 +145,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
106 child: SingleChildScrollView( 145 child: SingleChildScrollView(
107 child: Column( 146 child: Column(
108 children: [ 147 children: [
109 - _item('主题颜色选择', themeColorData[themeColorIndex].name,  
110 - onTap: () { 148 + _item('主题颜色选择', themeColerModel.name, onTap: () {
111 DialogUtil.showThemeColorSelectDialog(context, themeColorData, 149 DialogUtil.showThemeColorSelectDialog(context, themeColorData,
112 callback: (object) { 150 callback: (object) {
113 print(object); 151 print(object);
@@ -132,7 +170,7 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -132,7 +170,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
132 Container( 170 Container(
133 width: double.infinity, 171 width: double.infinity,
134 height: w(165), 172 height: w(165),
135 - color: themeColorData[themeColorIndex].color, 173 + color: themeColerModel.color,
136 child: Column( 174 child: Column(
137 children: [ 175 children: [
138 Align( 176 Align(
@@ -143,12 +181,122 @@ class _FirstImagePageState extends State<FirstImagePage> { @@ -143,12 +181,122 @@ class _FirstImagePageState extends State<FirstImagePage> {
143 ), 181 ),
144 ), 182 ),
145 Container( 183 Container(
  184 + width: double.infinity,
  185 + alignment: Alignment.center,
  186 + height: w(39),
  187 + child: TextField(
  188 + maxLines: 1,
  189 + controller: titleC,
  190 + focusNode: titleNode,
  191 + // autofocus: true,
  192 +
  193 + style: TextStyle(
  194 + fontSize: font(36),
  195 + foreground: Paint()
  196 + ..shader = themeColerModel.gradient
  197 + .createShader(Rect.fromLTWH(0, 0,
  198 + ScreenUtil().screenWidth, w(39)))),
  199 +
  200 + textAlign: TextAlign.center,
  201 + decoration: InputDecoration(
  202 + hintText: "点击输入标题",
  203 + hintStyle: TextStyle(
  204 + fontSize: font(36),
  205 + foreground: Paint()
  206 + ..shader = themeColerModel.gradient
  207 + .createShader(Rect.fromLTWH(0, 0,
  208 + ScreenUtil().screenWidth, w(39)))),
  209 + // isCollapsed:
  210 + // true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
  211 + border:
  212 + OutlineInputBorder(borderSide: BorderSide.none),
  213 + contentPadding: EdgeInsets.zero,
  214 + ),
  215 + keyboardType: TextInputType.number,
  216 + textInputAction: TextInputAction.done,
  217 +
  218 + onChanged: (value) {
  219 + // setState(() {});
  220 + // _searchSellerLocation();
  221 + // customerProvider.searchData(value);
  222 + },
  223 + onEditingComplete: () {
  224 + FocusScope.of(context)
  225 + .requestFocus(FocusNode()); //点击空白处隐藏键盘
  226 + // contantShowModel.searchData(
  227 + // contantShowModel.controller.text);
  228 + // _searchSellerLocation();
  229 + // _focusNode.unfocus();
  230 + },
  231 + ),
  232 + ),
  233 + VEmptyView(12),
  234 + Container(
  235 + width: double.infinity,
  236 + alignment: Alignment.center,
146 height: w(39), 237 height: w(39),
147 - child: Text('data'),  
148 - ) 238 + child: TextField(
  239 + maxLines: 1,
  240 + controller: titleC,
  241 + focusNode: titleNode,
  242 + // autofocus: true,
  243 +
  244 + style: TextStyle(
  245 + fontSize: font(20),
  246 + foreground: Paint()
  247 + ..shader = themeColerModel.gradientSub
  248 + .createShader(Rect.fromLTWH(0, 0,
  249 + ScreenUtil().screenWidth, w(29)))),
  250 +
  251 + textAlign: TextAlign.center,
  252 + decoration: InputDecoration(
  253 + hintText: "点击输入店铺Slogan",
  254 + hintStyle: TextStyle(
  255 + fontSize: font(20),
  256 + foreground: Paint()
  257 + ..shader = themeColerModel.gradientSub
  258 + .createShader(Rect.fromLTWH(0, 0,
  259 + ScreenUtil().screenWidth, w(29)))),
  260 + // isCollapsed:
  261 + // true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
  262 + border:
  263 + OutlineInputBorder(borderSide: BorderSide.none),
  264 + contentPadding: EdgeInsets.zero,
  265 + ),
  266 + keyboardType: TextInputType.number,
  267 + textInputAction: TextInputAction.done,
  268 +
  269 + onChanged: (value) {
  270 + // setState(() {});
  271 + // _searchSellerLocation();
  272 + // customerProvider.searchData(value);
  273 + },
  274 + onEditingComplete: () {
  275 + FocusScope.of(context)
  276 + .requestFocus(FocusNode()); //点击空白处隐藏键盘
  277 + // contantShowModel.searchData(
  278 + // contantShowModel.controller.text);
  279 + // _searchSellerLocation();
  280 + // _focusNode.unfocus();
  281 + },
  282 + ),
  283 + ),
149 ], 284 ],
150 ), 285 ),
151 ), 286 ),
  287 + InkWell(
  288 + onTap: () {},
  289 + child: Container(
  290 + color: MyColours.color_d9d9d9,
  291 + height: w(210),
  292 + child: Column(
  293 + children: [
  294 + VEmptyView(80),
  295 + Image.asset(Utils.getImgPath(''))
  296 + ],
  297 + ),
  298 + ),
  299 + )
152 ], 300 ],
153 ), 301 ),
154 )), 302 )),
1 import 'package:flutter/material.dart'; 1 import 'package:flutter/material.dart';
2 2
3 class MyColours { 3 class MyColours {
  4 + static const Color color_EEAE74 = Color(0xFFEEAE74);
  5 + static const Color color_C76216 = Color(0xFFC76216);
  6 + static const Color color_0C0F0E = Color(0xFF0C0F0E);
4 static const Color color_0143A3 = Color(0xFF0143A3); 7 static const Color color_0143A3 = Color(0xFF0143A3);
5 static const Color color_438E93 = Color(0xFF438E93); 8 static const Color color_438E93 = Color(0xFF438E93);
6 - static const Color color_0C0F0E = Color(0xFF0C0F0E);  
7 static const Color color_28323B = Color(0xFF28323B); 9 static const Color color_28323B = Color(0xFF28323B);
8 static const Color color_80438E93 = Color(0x80438E93); 10 static const Color color_80438E93 = Color(0x80438E93);
9 static const Color color_303030 = Color(0xff303030); 11 static const Color color_303030 = Color(0xff303030);