498 lines
19 KiB
Dart
498 lines
19 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
import '../../common/func.dart';
|
|
import '../../dialog/create_type_dialog.dart';
|
|
|
|
class CreatePage extends StatefulWidget {
|
|
const CreatePage({super.key});
|
|
|
|
@override
|
|
State<CreatePage> createState() => _CreatePageState();
|
|
}
|
|
|
|
class _CreatePageState extends State<CreatePage> {
|
|
final TextEditingController _textBgController = TextEditingController();
|
|
|
|
int gender = 1; //性别类型 1:男 0:女 3:其他
|
|
|
|
String nameText = ""; //人物名字
|
|
void _textNameChanged(String str) {
|
|
nameText = str;
|
|
}
|
|
|
|
String bgText = ""; //人物背景
|
|
void _textBgChanged(String str) {
|
|
bgText = str;
|
|
}
|
|
|
|
String imageText = ""; //人物形象
|
|
void _textImageChanged(String str) {
|
|
imageText = str;
|
|
}
|
|
|
|
int currentStyleIndex = 0; //风格
|
|
|
|
List<int> styleList = [1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
|
|
String type = ""; //分类
|
|
|
|
@override
|
|
void initState() {
|
|
// TODO: implement initState
|
|
super.initState();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final size = MediaQuery.of(context).size;
|
|
return Scaffold(
|
|
backgroundColor: Color(0xFF121213),
|
|
appBar: AppBar(
|
|
backgroundColor: Color(0xFF121213),
|
|
scrolledUnderElevation: 0.0,
|
|
title: Text(
|
|
'创建个人模型',
|
|
style: TextStyle(fontSize: 16, color: Colors.white),
|
|
),
|
|
centerTitle: true,
|
|
leading: IconButton(
|
|
iconSize: 18,
|
|
icon: Icon(Icons.arrow_back_ios_sharp),
|
|
color: Colors.white,
|
|
onPressed: () {
|
|
// 处理返回操作
|
|
Navigator.pop(context);
|
|
},
|
|
),
|
|
),
|
|
body: SingleChildScrollView(
|
|
child: Container(
|
|
margin: EdgeInsets.symmetric(horizontal: 16),
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
alignment: Alignment.center,
|
|
child: Text(
|
|
"角色信息",
|
|
style: TextStyle(color: Color(0xFFFF9000), fontSize: 15),
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 15),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
"角色昵称",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
TextField(
|
|
cursorColor: const Color(0xFFFF9000),
|
|
style: const TextStyle(color: Colors.white),
|
|
onChanged: _textNameChanged,
|
|
decoration: const InputDecoration(
|
|
hintText: '给角色取个名字',
|
|
hintStyle: TextStyle(color: Color(0xFF4C4C4C), fontSize: 13),
|
|
border: UnderlineInputBorder(
|
|
borderSide: BorderSide(color: Color(0xFF3A3A3A)), // 设置下划线颜色
|
|
),
|
|
focusedBorder: UnderlineInputBorder(
|
|
borderSide: BorderSide(color: Color(0xFFFF9000)),
|
|
),
|
|
),
|
|
maxLength: 8,
|
|
),
|
|
Container(
|
|
margin: const EdgeInsets.only(top: 10),
|
|
alignment: Alignment.centerLeft,
|
|
child: const Text(
|
|
"性别",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
Container(
|
|
margin: const EdgeInsets.only(top: 17),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
GestureDetector(
|
|
onTap: () {
|
|
gender = 1;
|
|
setState(() {});
|
|
},
|
|
child: Container(
|
|
width: 93,
|
|
height: 32,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
border: Border.all(color: Color(gender == 1 ? 0xFFFF9000 : 0xFF686868), width: 1),
|
|
borderRadius: const BorderRadius.all(Radius.circular(7))),
|
|
child: Text(
|
|
"男",
|
|
style: TextStyle(fontSize: 13, color: Color(gender == 1 ? 0xFFFF9000 : 0xFF686868)),
|
|
),
|
|
),
|
|
),
|
|
GestureDetector(
|
|
onTap: () {
|
|
gender = 2;
|
|
setState(() {});
|
|
},
|
|
child: Container(
|
|
width: 93,
|
|
height: 32,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
border: Border.all(color: Color(gender == 2 ? 0xFFFF9000 : 0xFF686868), width: 1),
|
|
borderRadius: BorderRadius.all(Radius.circular(7))),
|
|
child: Text(
|
|
"女",
|
|
style: TextStyle(fontSize: 13, color: Color(gender == 2 ? 0xFFFF9000 : 0xFF686868)),
|
|
),
|
|
),
|
|
),
|
|
GestureDetector(
|
|
onTap: () {
|
|
gender = 3;
|
|
setState(() {});
|
|
},
|
|
child: Container(
|
|
width: 93,
|
|
height: 32,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
border: Border.all(color: Color(gender == 3 ? 0xFFFF9000 : 0xFF686868), width: 1),
|
|
borderRadius: BorderRadius.all(Radius.circular(7))),
|
|
child: Text(
|
|
"其他",
|
|
style: TextStyle(fontSize: 13, color: Color(gender == 3 ? 0xFFFF9000 : 0xFF686868)),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 20),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
"身份背景",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
Container(
|
|
alignment: Alignment.center,
|
|
margin: EdgeInsets.only(top: 20),
|
|
padding: const EdgeInsets.only(left: 9, top: 5, right: 9),
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFF262626),
|
|
borderRadius: BorderRadius.all(Radius.circular(6.6)),
|
|
),
|
|
child: TextField(
|
|
controller: _textBgController,
|
|
keyboardType: TextInputType.name,
|
|
cursorColor: Color(0xFFFF9000),
|
|
// focusNode: _commentFocus,
|
|
decoration:
|
|
InputDecoration.collapsed(hintText: '描述越详细，越接近你心目中的形象', hintStyle: const TextStyle(fontSize: 12.0, color: Color(0xFF535353))),
|
|
textAlign: TextAlign.left,
|
|
maxLines: 6,
|
|
style: const TextStyle(fontSize: 14.0, color: Colors.white),
|
|
onChanged: _textBgChanged,
|
|
autofocus: false,
|
|
maxLength: 500,
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 15),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
"开场白",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
TextField(
|
|
cursorColor: const Color(0xFFFF9000),
|
|
style: const TextStyle(color: Colors.white),
|
|
onChanged: _textNameChanged,
|
|
decoration: const InputDecoration(
|
|
hintText: '它的开场第一句话',
|
|
hintStyle: TextStyle(color: Color(0xFF4C4C4C), fontSize: 13),
|
|
border: UnderlineInputBorder(
|
|
borderSide: BorderSide(color: Color(0xFF3A3A3A)), // 设置下划线颜色
|
|
),
|
|
focusedBorder: UnderlineInputBorder(
|
|
borderSide: BorderSide(color: Color(0xFFFF9000)),
|
|
),
|
|
),
|
|
maxLength: 50,
|
|
),
|
|
GestureDetector(
|
|
onTap: () {
|
|
FunctionUtil.bottomSheetDialog(context, CreateTypeDialog(
|
|
onTap: (type) {
|
|
this.type = type;
|
|
setState(() {});
|
|
},
|
|
));
|
|
},
|
|
child: Container(
|
|
width: double.infinity,
|
|
height: 45,
|
|
margin: EdgeInsets.only(top: 10),
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFF202020),
|
|
borderRadius: BorderRadius.all(Radius.circular(7)),
|
|
),
|
|
child: Stack(
|
|
alignment: Alignment.center,
|
|
children: [
|
|
Positioned(
|
|
left: 10,
|
|
child: Text(
|
|
"分类",
|
|
style: TextStyle(color: Colors.white),
|
|
),
|
|
),
|
|
Positioned(
|
|
right: 10,
|
|
child: Text(
|
|
type == "" ? "添加" : type,
|
|
style: TextStyle(color: type == "" ? Colors.white : Color(0xFFFF9000)),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
Container(
|
|
width: double.infinity,
|
|
height: 45,
|
|
margin: EdgeInsets.only(top: 17),
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFF202020),
|
|
borderRadius: BorderRadius.all(Radius.circular(7)),
|
|
),
|
|
child: Container(),
|
|
),
|
|
Container(
|
|
alignment: Alignment.center,
|
|
margin: EdgeInsets.only(top: 41),
|
|
child: Text(
|
|
"角色形象",
|
|
style: TextStyle(color: Color(0xFFFF9000), fontSize: 15),
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 15),
|
|
alignment: Alignment.centerLeft,
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
"形象描述",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
Text(
|
|
"随机生成",
|
|
style: TextStyle(color: Color(0xFFFF9000), fontSize: 10),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Container(
|
|
alignment: Alignment.center,
|
|
margin: EdgeInsets.only(top: 20),
|
|
padding: const EdgeInsets.only(left: 9, top: 5, right: 9),
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFF262626),
|
|
borderRadius: BorderRadius.all(Radius.circular(6.6)),
|
|
),
|
|
child: TextField(
|
|
// controller: _textBgController,
|
|
keyboardType: TextInputType.name,
|
|
cursorColor: Color(0xFFFF9000),
|
|
// focusNode: _commentFocus,
|
|
decoration: InputDecoration.collapsed(hintText: '长相,场景,衣服', hintStyle: const TextStyle(fontSize: 12.0, color: Color(0xFF535353))),
|
|
textAlign: TextAlign.left,
|
|
maxLines: 3,
|
|
style: const TextStyle(fontSize: 14.0, color: Colors.white),
|
|
onChanged: _textImageChanged,
|
|
autofocus: false,
|
|
maxLength: 100,
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 15),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
"风格选择",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
SingleChildScrollView(
|
|
scrollDirection: Axis.horizontal,
|
|
child: Container(
|
|
// width: 500,
|
|
alignment: Alignment.centerLeft,
|
|
margin: EdgeInsets.only(top: 21),
|
|
height: 154,
|
|
child: GridView.count(
|
|
shrinkWrap: true,
|
|
//水平子Widget之间间距
|
|
crossAxisSpacing: 12.0,
|
|
//垂直子Widget之间间距
|
|
mainAxisSpacing: 9.0,
|
|
//GridView内边距
|
|
padding: EdgeInsets.zero,
|
|
//一行的Widget数量
|
|
crossAxisCount: 2,
|
|
//子Widget宽高比例
|
|
childAspectRatio: 1.0,
|
|
//子Widget列表
|
|
children: _item(styleList),
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
//类似 cellForRow 函数
|
|
scrollDirection: Axis.horizontal)),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 15),
|
|
alignment: Alignment.centerLeft,
|
|
child: Text(
|
|
"选择参考图像",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
),
|
|
),
|
|
Container(
|
|
width: double.infinity,
|
|
height: 118,
|
|
margin: EdgeInsets.only(top: 17),
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFF202020),
|
|
borderRadius: BorderRadius.all(Radius.circular(7)),
|
|
),
|
|
child: Stack(
|
|
alignment: Alignment.center,
|
|
children: [
|
|
Positioned(
|
|
top: 38,
|
|
child: Image(width: 18, height: 18, image: AssetImage('assets/images/img_add.png')),
|
|
),
|
|
Positioned(
|
|
top: 77,
|
|
child: Text(
|
|
"将基于上传的参考图片生成基础模型",
|
|
style: TextStyle(color: Color(0xFF6F6F6F), fontSize: 10),
|
|
))
|
|
],
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.only(top: 35),
|
|
width: size.width,
|
|
height: 30,
|
|
child: Stack(
|
|
alignment: Alignment.center,
|
|
children: [
|
|
Positioned(
|
|
left: 0,
|
|
child: Text(
|
|
"是否公开",
|
|
style: TextStyle(color: Colors.white, fontSize: 14),
|
|
)),
|
|
Positioned(
|
|
left: 70,
|
|
child: Text(
|
|
"审核中....",
|
|
style: TextStyle(color: Color(0xFF696969), fontSize: 12),
|
|
)),
|
|
Positioned(
|
|
right: 0,
|
|
child: Image(width: 52, height: 21, image: AssetImage('assets/images/ic_open_f.png')),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
Container(
|
|
margin: EdgeInsets.symmetric(vertical: 48),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 116,
|
|
height: 37,
|
|
alignment: Alignment.center,
|
|
decoration:
|
|
BoxDecoration(border: Border.all(color: Color(0xFFFF9000), width: 1), borderRadius: BorderRadius.all(Radius.circular(7))),
|
|
child: Text(
|
|
"智能一键生成",
|
|
style: TextStyle(fontSize: 14, color: Color(0xFFFF9000)),
|
|
),
|
|
),
|
|
Container(
|
|
width: 191,
|
|
height: 37,
|
|
alignment: Alignment.center,
|
|
decoration: BoxDecoration(
|
|
color: Color(0xFFFF9000),
|
|
borderRadius: BorderRadius.all(Radius.circular(7)),
|
|
),
|
|
child: Text(
|
|
"立即生成",
|
|
style: TextStyle(fontSize: 14, color: Colors.black),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
_item(List<int> list) {
|
|
final size = MediaQuery.of(context).size;
|
|
final w113 = size.width / 3.185840707964602;
|
|
final h159 = size.width / 2.264150943396226;
|
|
final w105 = size.width / 3.428571428571429;
|
|
|
|
return list.map((res) {
|
|
int index = styleList.indexOf(res);
|
|
return GestureDetector(
|
|
onTap: () {
|
|
currentStyleIndex = index;
|
|
setState(() {});
|
|
},
|
|
child: Container(
|
|
alignment: Alignment.center,
|
|
child: Stack(
|
|
children: [
|
|
// ClipRRect(
|
|
// borderRadius: BorderRadius.all(Radius.circular(15)),
|
|
// child: CachedNetworkImage(
|
|
// width: w113,
|
|
// height: h159,
|
|
// fit: BoxFit.cover,
|
|
// imageUrl: res.imageUrl!,
|
|
// errorWidget: (context, url, error) => const Icon(Icons.error),
|
|
// ),
|
|
// ),
|
|
Container(
|
|
width: 72,
|
|
height: 72,
|
|
decoration: BoxDecoration(
|
|
color: Colors.grey,
|
|
borderRadius: BorderRadius.all(Radius.circular(7)),
|
|
border: Border.all(color: Color(0xFFFF9000), width: currentStyleIndex == index ? 1 : 0),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}).toList();
|
|
}
|
|
}
|