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';
class ThemeColorModel {
String name;
Color color;
Gradient gradient; //标题
Gradient gradientSub; //店铺slogan
}
... ...
... ... @@ -27,6 +27,12 @@ class _FirstImagePageState extends State<FirstImagePage> {
List<ThemeColorModel> themeColorData = [];
int themeColorIndex = 0;
TextEditingController titleC = TextEditingController();
FocusNode titleNode = FocusNode();
TextEditingController sloganC = TextEditingController();
FocusNode sloganNode = FocusNode();
@override
void initState() {
super.initState();
... ... @@ -39,16 +45,48 @@ class _FirstImagePageState extends State<FirstImagePage> {
ThemeColorModel colorModel = ThemeColorModel();
colorModel.name = '睿智黑';
colorModel.color = MyColours.color_0C0F0E;
colorModel.gradient = LinearGradient(
stops: [0, 1],
colors: [
// Color.fromARGB(67, 59, 206, 224),
// Color.fromRGBO(67, 85, 250, 162),
MyColours.color_0C0F0E,
MyColours.color_C76216,
],
// begin: Alignment(0, 0),
// end: Alignment(2, 2),
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
);
colorModel.gradientSub = LinearGradient(
stops: [0.2, 1.24],
colors: [
// Color.fromARGB(67, 59, 206, 224),
// Color.fromRGBO(67, 85, 250, 162),
MyColours.color_0C0F0E,
MyColours.color_EEAE74,
],
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
);
themeColorData.add(colorModel);
ThemeColorModel colorModel1 = ThemeColorModel();
colorModel1.name = '孔雀蓝';
colorModel1.color = MyColours.color_0143A3;
colorModel1.gradient = LinearGradient(colors: [
Colors.red,
Colors.yellow,
]);
themeColorData.add(colorModel1);
ThemeColorModel colorModel2 = ThemeColorModel();
colorModel2.name = '群青绿';
colorModel2.color = MyColours.color_438E93;
colorModel2.gradient = LinearGradient(colors: [
Colors.red,
Colors.yellow,
]);
themeColorData.add(colorModel2);
}
... ... @@ -92,6 +130,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
@override
Widget build(BuildContext context) {
ThemeColorModel themeColerModel = themeColorData[themeColorIndex];
return Scaffold(
backgroundColor: MyColours.color_ffffff,
appBar: SystemAppBar(
... ... @@ -106,8 +145,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
child: SingleChildScrollView(
child: Column(
children: [
_item('主题颜色选择', themeColorData[themeColorIndex].name,
onTap: () {
_item('主题颜色选择', themeColerModel.name, onTap: () {
DialogUtil.showThemeColorSelectDialog(context, themeColorData,
callback: (object) {
print(object);
... ... @@ -132,7 +170,7 @@ class _FirstImagePageState extends State<FirstImagePage> {
Container(
width: double.infinity,
height: w(165),
color: themeColorData[themeColorIndex].color,
color: themeColerModel.color,
child: Column(
children: [
Align(
... ... @@ -143,12 +181,122 @@ class _FirstImagePageState extends State<FirstImagePage> {
),
),
Container(
width: double.infinity,
alignment: Alignment.center,
height: w(39),
child: TextField(
maxLines: 1,
controller: titleC,
focusNode: titleNode,
// autofocus: true,
style: TextStyle(
fontSize: font(36),
foreground: Paint()
..shader = themeColerModel.gradient
.createShader(Rect.fromLTWH(0, 0,
ScreenUtil().screenWidth, w(39)))),
textAlign: TextAlign.center,
decoration: InputDecoration(
hintText: "点击输入标题",
hintStyle: TextStyle(
fontSize: font(36),
foreground: Paint()
..shader = themeColerModel.gradient
.createShader(Rect.fromLTWH(0, 0,
ScreenUtil().screenWidth, w(39)))),
// isCollapsed:
// true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
border:
OutlineInputBorder(borderSide: BorderSide.none),
contentPadding: EdgeInsets.zero,
),
keyboardType: TextInputType.number,
textInputAction: TextInputAction.done,
onChanged: (value) {
// setState(() {});
// _searchSellerLocation();
// customerProvider.searchData(value);
},
onEditingComplete: () {
FocusScope.of(context)
.requestFocus(FocusNode()); //点击空白处隐藏键盘
// contantShowModel.searchData(
// contantShowModel.controller.text);
// _searchSellerLocation();
// _focusNode.unfocus();
},
),
),
VEmptyView(12),
Container(
width: double.infinity,
alignment: Alignment.center,
height: w(39),
child: Text('data'),
)
child: TextField(
maxLines: 1,
controller: titleC,
focusNode: titleNode,
// autofocus: true,
style: TextStyle(
fontSize: font(20),
foreground: Paint()
..shader = themeColerModel.gradientSub
.createShader(Rect.fromLTWH(0, 0,
ScreenUtil().screenWidth, w(29)))),
textAlign: TextAlign.center,
decoration: InputDecoration(
hintText: "点击输入店铺Slogan",
hintStyle: TextStyle(
fontSize: font(20),
foreground: Paint()
..shader = themeColerModel.gradientSub
.createShader(Rect.fromLTWH(0, 0,
ScreenUtil().screenWidth, w(29)))),
// isCollapsed:
// true, //重点，相当于高度包裹的意思，必须设置为true，不然有默认奇妙的最小高度
border:
OutlineInputBorder(borderSide: BorderSide.none),
contentPadding: EdgeInsets.zero,
),
keyboardType: TextInputType.number,
textInputAction: TextInputAction.done,
onChanged: (value) {
// setState(() {});
// _searchSellerLocation();
// customerProvider.searchData(value);
},
onEditingComplete: () {
FocusScope.of(context)
.requestFocus(FocusNode()); //点击空白处隐藏键盘
// contantShowModel.searchData(
// contantShowModel.controller.text);
// _searchSellerLocation();
// _focusNode.unfocus();
},
),
),
],
),
),
InkWell(
onTap: () {},
child: Container(
color: MyColours.color_d9d9d9,
height: w(210),
child: Column(
children: [
VEmptyView(80),
Image.asset(Utils.getImgPath(''))
],
),
),
)
],
),
)),
... ...
import 'package:flutter/material.dart';
class MyColours {
static const Color color_EEAE74 = Color(0xFFEEAE74);
static const Color color_C76216 = Color(0xFFC76216);
static const Color color_0C0F0E = Color(0xFF0C0F0E);
static const Color color_0143A3 = Color(0xFF0143A3);
static const Color color_438E93 = Color(0xFF438E93);
static const Color color_0C0F0E = Color(0xFF0C0F0E);
static const Color color_28323B = Color(0xFF28323B);
static const Color color_80438E93 = Color(0x80438E93);
static const Color color_303030 = Color(0xff303030);
... ...