You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
300 lines
9.5 KiB
300 lines
9.5 KiB
import 'package:carousel_slider/carousel_slider.dart';
|
|
import 'package:flutter/material.dart';
|
|
// import 'package:flutter/widgets.dart';
|
|
// import 'package:get/get.dart';
|
|
// import 'package:get/get_utils/src/extensions/internacionalization.dart';
|
|
// import 'package:imboy/config/const.dart';
|
|
|
|
class ExtraItem extends StatelessWidget {
|
|
const ExtraItem({
|
|
Key? key,
|
|
required this.onPressed,
|
|
required this.image,
|
|
double? this.width,
|
|
double? this.height,
|
|
required this.title,
|
|
}) : super(key: key);
|
|
|
|
final ImageProvider image;
|
|
final void Function()? onPressed;
|
|
final double? width;
|
|
final double? height;
|
|
final String title;
|
|
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return GestureDetector(
|
|
onTap: this.onPressed ?? () => {
|
|
print('功能暂未实现')
|
|
},
|
|
child: Padding(
|
|
padding: EdgeInsets.only(left: 10, top: 13, right: 10, bottom: 0),
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
width: this.width ?? 56,
|
|
height: this.height ?? 56,
|
|
// margin: EdgeInsets.symmetric(horizontal: 10),
|
|
child: Material(
|
|
color: AppColors.ChatInputBackgroundColor,
|
|
// INK可以实现装饰容器
|
|
child: new Ink(
|
|
// 用ink圆角矩形
|
|
decoration: BoxDecoration(
|
|
// 背景
|
|
color: AppColors.ChatInputBackgroundColor,
|
|
// 设置四周圆角 角度
|
|
borderRadius: BorderRadius.all(Radius.circular(16.0)),
|
|
// 设置四周边框
|
|
border: Border.all(
|
|
width: 1,
|
|
color: AppColors.ChatInputBackgroundColor,
|
|
),
|
|
),
|
|
child: Image(
|
|
image: this.image,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Text(this.title,style: TextStyle(color: Color(0xFF333333)),),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class ExtraItems extends StatefulWidget {
|
|
const ExtraItems({
|
|
Key? key,
|
|
this.handleImageSelection,
|
|
this.handleFileSelection,
|
|
this.handlePickerSelection,
|
|
this.handleUploadVideo,
|
|
this.handleCaptureVideo, this.handleShowOrders,
|
|
}) : super(key: key);
|
|
|
|
final void Function()? handleImageSelection;
|
|
final void Function()? handleFileSelection;
|
|
final void Function()? handlePickerSelection;
|
|
final void Function()? handleUploadVideo;
|
|
final void Function()? handleCaptureVideo;
|
|
final void Function()? handleShowOrders;///新增外部显示订单弹窗
|
|
|
|
|
|
@override
|
|
_ExtraItemsState createState() => _ExtraItemsState();
|
|
}
|
|
|
|
class _ExtraItemsState extends State<ExtraItems> {
|
|
int _current = 0;
|
|
CarouselController _controller = CarouselController();
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
var items = [
|
|
Column(
|
|
children: <Widget>[
|
|
Row(
|
|
children: [
|
|
ExtraItem(
|
|
title: "照片",
|
|
image: AssetImage('assets/images/chat/extra_photo.webp'),
|
|
onPressed: widget.handleImageSelection,
|
|
),
|
|
ExtraItem(
|
|
title: "拍摄",
|
|
image: AssetImage('assets/images/chat/extra_camera.webp'),
|
|
onPressed: widget.handlePickerSelection,
|
|
),
|
|
ExtraItem(
|
|
title: "上传视频",
|
|
image: AssetImage('assets/images/chat/extra_media.webp'),
|
|
onPressed: widget.handleUploadVideo,
|
|
),
|
|
ExtraItem(
|
|
title: "录制视频",
|
|
image: AssetImage('assets/images/chat/extra_videocall.webp'),
|
|
onPressed: widget.handleCaptureVideo,
|
|
),
|
|
// ExtraItem(
|
|
// title: "位置",
|
|
// image: AssetImage('assets/images/chat/extra_localtion.webp'),
|
|
// onPressed: null,
|
|
// ),
|
|
],
|
|
),
|
|
Row(
|
|
children: [
|
|
// TODO: 选择文件
|
|
ExtraItem(
|
|
title: "发送订单",
|
|
image: AssetImage('assets/images/chat/extra_wallet.png'),
|
|
onPressed: widget.handleShowOrders,
|
|
),
|
|
// ExtraItem(
|
|
// title: "语音输入",
|
|
// image: AssetImage('assets/images/chat/extra_voice.webp'),
|
|
// onPressed: null,
|
|
// ),
|
|
// ExtraItem(
|
|
// title: "收藏",
|
|
// image: AssetImage('assets/images/chat/extra_favorite.webp'),
|
|
// onPressed: null,
|
|
// ),
|
|
// ExtraItem(
|
|
// title: "个人名片",
|
|
// image: AssetImage('assets/images/chat/extra_card.webp'),
|
|
// onPressed: null,
|
|
// ),
|
|
],
|
|
)
|
|
],
|
|
),
|
|
// Column(
|
|
// children: <Widget>[
|
|
// Row(children: [
|
|
// ExtraItem(
|
|
// title: "文件",
|
|
// image: AssetImage('assets/images/chat/extra_file.webp'),
|
|
// onPressed: widget.handleFileSelection,
|
|
// ),
|
|
// ExtraItem(
|
|
// title: "卡券",
|
|
// image: AssetImage('assets/images/chat/extra_wallet.png'),
|
|
// onPressed: null,
|
|
// ),
|
|
// ]),
|
|
// ],
|
|
// ),
|
|
];
|
|
return Column(
|
|
children: <Widget>[
|
|
Expanded(
|
|
child: CarouselSlider(
|
|
options: CarouselOptions(
|
|
height: 50, // Get.height,
|
|
viewportFraction: 1.0,
|
|
aspectRatio: 2.0,
|
|
scrollDirection: Axis.horizontal,
|
|
disableCenter: true,
|
|
initialPage: 1,
|
|
enableInfiniteScroll: false,
|
|
onPageChanged: (index, reason) {
|
|
setState(() {
|
|
_current = index;
|
|
});
|
|
},
|
|
),
|
|
items: items.map((tab) {
|
|
return Padding(
|
|
padding: EdgeInsets.only(left: 8),
|
|
child: tab,
|
|
);
|
|
}).toList(),
|
|
),
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: items.asMap().entries.map((entry) {
|
|
return GestureDetector(
|
|
onTap: () => _controller.animateToPage(entry.key),
|
|
child: Container(
|
|
width: 10.0,
|
|
height: 10.0,
|
|
margin: EdgeInsets.symmetric(
|
|
vertical: 8.0,
|
|
horizontal: 6.0,
|
|
),
|
|
decoration: BoxDecoration(
|
|
shape: BoxShape.circle,
|
|
color: (Theme.of(context).brightness == Brightness.dark
|
|
? Colors.white
|
|
: Colors.black)
|
|
.withOpacity(_current == entry.key ? 0.7 : 0.2),
|
|
),
|
|
),
|
|
);
|
|
}).toList(),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|
|
|
|
class AppColors {
|
|
static const AppBarColor = Color.fromRGBO(237, 237, 237, 1);
|
|
|
|
static const BgColor = Color.fromRGBO(255, 255, 255, 1);
|
|
|
|
static const LineColor = Colors.grey;
|
|
|
|
static const TipColor = Color.fromRGBO(89, 96, 115, 1.0);
|
|
|
|
static const MainTextColor = Color.fromRGBO(115, 115, 115, 1.0);
|
|
|
|
static const LabelTextColor = Color.fromRGBO(144, 144, 144, 1.0);
|
|
|
|
static const ItemBgColor = Color.fromRGBO(75, 75, 75, 1.0);
|
|
|
|
static const ItemOnColor = Color.fromRGBO(68, 68, 68, 1.0);
|
|
|
|
static const ButtonTextColor = Color.fromRGBO(112, 113, 135, 1.0);
|
|
|
|
static const TitleColor = 0xff181818;
|
|
static const ButtonArrowColor = 0xffadadad;
|
|
|
|
///
|
|
|
|
/// 主背景 白色
|
|
static const Color primaryBackground = Color.fromARGB(255, 255, 255, 255);
|
|
|
|
/// 主文本 灰色
|
|
static const Color primaryText = Color.fromARGB(255, 45, 45, 47);
|
|
|
|
/// 主控件-背景 绿色
|
|
static const Color primaryElement = Color.fromARGB(255, 109, 192, 102);
|
|
|
|
/// 主控件-文本 白色
|
|
static const Color primaryElementText = Color.fromARGB(255, 255, 255, 255);
|
|
|
|
// *****************************************
|
|
|
|
/// 第二种控件-背景色 淡灰色
|
|
static const Color secondaryElement = Color.fromARGB(255, 246, 246, 246);
|
|
|
|
/// 第二种控件-文本 浅绿色
|
|
static const Color secondaryElementText = Color.fromRGBO(169, 234, 122, 1.0);
|
|
|
|
// *****************************************
|
|
|
|
/// 第三种控件-背景色 石墨色
|
|
static const Color thirdElement = Color.fromARGB(255, 45, 45, 47);
|
|
|
|
/// 第三种控件-文本 浅灰色2
|
|
static const Color thirdElementText = Color.fromARGB(255, 141, 141, 142);
|
|
|
|
// *****************************************
|
|
|
|
/// tabBar 默认颜色 灰色
|
|
static const Color tabBarElement = Color.fromARGB(255, 208, 208, 208);
|
|
|
|
/// tabCellSeparator 单元格底部分隔条 颜色
|
|
static const Color tabCellSeparator = Color.fromARGB(255, 230, 230, 231);
|
|
|
|
// for chat
|
|
static const ChatBg = Color.fromRGBO(243, 243, 243, 1.0);
|
|
static const ChatSendMessgeBgColor = Color.fromRGBO(169, 234, 122, 1.0);
|
|
static const ChatSentMessageBodyTextColor = Color.fromRGBO(19, 29, 13, 1.0);
|
|
|
|
static const ChatReceivedMessageBodyTextColor =
|
|
Color.fromRGBO(25, 25, 25, 1.0);
|
|
static const ChatReceivedMessageBodyBgColor =
|
|
Color.fromRGBO(255, 255, 255, 1.0);
|
|
static const ChatInputBackgroundColor = Color.fromRGBO(240, 240, 240, 1.0);
|
|
static const ChatInputFillGgColor = Color.fromRGBO(251, 251, 251, 1.0);
|
|
// end for chat
|
|
}
|