351 lines
11 KiB
Dart
351 lines
11 KiB
Dart
import 'package:dropdown_button2/dropdown_button2.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:furibase/components/bottom_navbar.dart';
|
|
import 'package:furibase/components/buildcard_info.dart';
|
|
import 'package:furibase/components/main_menu.dart';
|
|
import 'package:furibase/components/scan_button.dart';
|
|
|
|
class HomeScreen extends StatefulWidget {
|
|
HomeScreen({super.key});
|
|
|
|
@override
|
|
State<HomeScreen> createState() => _HomeScreenState();
|
|
}
|
|
|
|
class _HomeScreenState extends State<HomeScreen> {
|
|
final String username = "User01";
|
|
double _sliderValue = 0.0;
|
|
static const Color transparent = Color(0xFFFFFFFF);
|
|
// Image image
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final Size size = MediaQuery.of(context).size;
|
|
return Scaffold(
|
|
// appBar: AppBar(
|
|
// elevation: 0,
|
|
// backgroundColor: Color(0x00000000),
|
|
// title: Row(
|
|
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
// children: [
|
|
// Row(
|
|
// children: [
|
|
// Text(
|
|
// username,
|
|
// style: const TextStyle(
|
|
// fontSize: 18,
|
|
// fontWeight: FontWeight.bold,
|
|
// ),
|
|
// ),
|
|
// SizedBox(width: 10),
|
|
// IconButton(
|
|
// icon: Icon(Icons.emoji_events, color: Color(0xFFE32087)),
|
|
// onPressed: () {},
|
|
// ),
|
|
// Text(
|
|
// "5000",
|
|
// style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
|
|
// ),
|
|
// ],
|
|
// ),
|
|
// Row(
|
|
// children: [
|
|
// IconButton(
|
|
// icon: Icon(Icons.monetization_on, color: Color(0xFFE32087)),
|
|
// onPressed: () {},
|
|
// ),
|
|
// Text(
|
|
// "1.300",
|
|
// style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
|
|
// ),
|
|
// // IconButton(
|
|
// // icon: Image.asset("images/icon.png", width: 24),
|
|
// // onPressed: () {},
|
|
// // ),
|
|
// ],
|
|
// ),
|
|
// ],
|
|
// ),
|
|
// ),
|
|
body: Stack(
|
|
children: <Widget>[
|
|
Positioned.fill(
|
|
child: RepaintBoundary(
|
|
child: Container(
|
|
decoration: const BoxDecoration(
|
|
image: const DecorationImage(
|
|
image: AssetImage("assets/images/background.jpeg"),
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
// Positioned(
|
|
// top: 0,
|
|
// left: 0,
|
|
// right: 0,
|
|
// child: SizedBox(height: 120, child: TopbarContainer()),
|
|
// ),
|
|
Positioned(
|
|
right: 0,
|
|
top: 100,
|
|
child: Padding(
|
|
padding: EdgeInsets.only(right: 20),
|
|
child: Container(
|
|
width: 40,
|
|
height: 40,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(1),
|
|
color: Color.fromARGB(1, 209, 174, 174).withAlpha(0),
|
|
),
|
|
child: Center(
|
|
child: DropdownButtonHideUnderline(
|
|
child: DropdownButton2(
|
|
customButton: Container(
|
|
height: 50,
|
|
width: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(10),
|
|
image: const DecorationImage(
|
|
image: AssetImage('assets/images/luffy-u.png'),
|
|
fit: BoxFit.cover,
|
|
),
|
|
),
|
|
),
|
|
openWithLongPress: false,
|
|
items: [
|
|
..._MenuItems.firstItems.map(
|
|
(item) => DropdownMenuItem<_MenuItem>(
|
|
value: item,
|
|
child: _MenuItems.buildItem(item),
|
|
),
|
|
),
|
|
// const DropdownMenuItem<Divider>(
|
|
// enabled: false,
|
|
// // height: 8,
|
|
// child: Divider(),
|
|
// ),
|
|
// ..._MenuItems.secondItems.map(
|
|
// (item) => DropdownMenuItem<_MenuItem>(
|
|
// value: item,
|
|
// // height: 48,
|
|
// child: _MenuItems.buildItem(item),
|
|
// ),
|
|
// ),
|
|
],
|
|
onChanged: (value) {
|
|
if (value != null) {
|
|
_MenuItems.onChanged(context, value);
|
|
} else {
|
|
print("null");
|
|
}
|
|
},
|
|
buttonStyleData: ButtonStyleData(
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(40),
|
|
),
|
|
),
|
|
dropdownStyleData: DropdownStyleData(
|
|
width: 140,
|
|
padding: EdgeInsets.zero,
|
|
maxHeight: 150,
|
|
// padding: const EdgeInsets.symmetric(vertical: 6),
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(4),
|
|
color: Color.fromRGBO(2, 104, 17, 1).withAlpha(50),
|
|
),
|
|
offset: const Offset(40, -4),
|
|
),
|
|
menuItemStyleData: MenuItemStyleData(
|
|
height: 35,
|
|
padding: EdgeInsets.symmetric(horizontal: 10),
|
|
),
|
|
// menuItemStyleData: const MenuItemStyleData(
|
|
// padding: EdgeInsets.only(left: 16, right: 16),
|
|
// ),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
top: 10,
|
|
left: 10,
|
|
right: 10,
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
BuildcardInfo(
|
|
icon: Icons.person,
|
|
text: username,
|
|
extraIcon: Icons.emoji_events,
|
|
extraText: "5000",
|
|
width: 180,
|
|
),
|
|
BuildcardInfo(
|
|
icon: Icons.monetization_on,
|
|
text: "1.300",
|
|
width: 90,
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Positioned(
|
|
bottom: 150,
|
|
left: 0,
|
|
right: 0,
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
|
|
decoration: BoxDecoration(
|
|
color: Color.fromARGB(255, 247, 224, 236),
|
|
borderRadius: BorderRadius.circular(10),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Color.fromARGB(255, 214, 213, 121),
|
|
blurRadius: 5,
|
|
spreadRadius: 2,
|
|
),
|
|
],
|
|
),
|
|
child: Text(
|
|
"Halo....Jotaslim",
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.bold,
|
|
color: Color(0xFF000000),
|
|
),
|
|
),
|
|
),
|
|
SizedBox(height: 10),
|
|
setHomeImage("assets/images/luffy.png", 300),
|
|
// Image.asset("images/luffy.png", width: 300),
|
|
],
|
|
),
|
|
),
|
|
// BG MEnu
|
|
Stack(
|
|
children: [
|
|
Positioned(
|
|
bottom: 0,
|
|
left: 0,
|
|
right: 0,
|
|
child: SizedBox(height: 85, child: BottomNavbar()),
|
|
),
|
|
],
|
|
),
|
|
Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()),
|
|
Positioned(
|
|
bottom: 1,
|
|
left: MediaQuery.of(context).size.width / 2 - 48,
|
|
child: Transform.translate(
|
|
offset: Offset(0, -20),
|
|
child: ScanButton(),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
// Widget _menuButton(String label, Widget icon) {
|
|
// return Expanded(
|
|
// child: Column(
|
|
// children: [
|
|
// IconButton(
|
|
// // icon: Icon(icon, color: Color.fromARGB(255, 179, 161, 170)),
|
|
// icon: icon,
|
|
// onPressed: () {},
|
|
// ),
|
|
// Text(
|
|
// label,
|
|
// style: TextStyle(
|
|
// color: Color.fromARGB(255, 239, 224, 232),
|
|
// fontWeight: FontWeight.bold,
|
|
// ),
|
|
// ),
|
|
// ],
|
|
// ),
|
|
// );
|
|
// }
|
|
|
|
// Widget _scanButton() {
|
|
// return Expanded(
|
|
// child: Container(
|
|
// decoration: BoxDecoration(shape: BoxShape.circle, color: transparent),
|
|
// padding: EdgeInsets.all(10),
|
|
// child: IconButton(
|
|
// icon: SvgPicture.asset(
|
|
// 'icons/Scan.svg',
|
|
// width: 60,
|
|
// height: 60,
|
|
// colorFilter: ColorFilter.mode(Color(0xFFFFFFFF), BlendMode.srcIn),
|
|
// ),
|
|
// onPressed: () {},
|
|
// ),
|
|
// ),
|
|
// );
|
|
// }
|
|
|
|
Widget setHomeImage(String src, double size) {
|
|
return Image.asset(src, width: size);
|
|
}
|
|
}
|
|
|
|
class _MenuItem {
|
|
const _MenuItem({required this.text, required this.icon});
|
|
final String text;
|
|
final IconData icon;
|
|
}
|
|
|
|
class _MenuItems {
|
|
static const List<_MenuItem> firstItems = [like, share, download];
|
|
static const List<_MenuItem> secondItems = [cancel];
|
|
static const like = _MenuItem(text: 'Like', icon: Icons.favorite);
|
|
static const share = _MenuItem(text: 'Share', icon: Icons.share);
|
|
static const download = _MenuItem(text: 'Download', icon: Icons.download);
|
|
static const cancel = _MenuItem(text: 'Cancel', icon: Icons.cancel);
|
|
|
|
static Widget buildItem(_MenuItem item) {
|
|
return Container(
|
|
height: 30,
|
|
padding: EdgeInsets.symmetric(vertical: 2),
|
|
alignment: Alignment.centerLeft,
|
|
child: Row(
|
|
children: [
|
|
// Icon(item.icon, color: Color.fromRGBO(242, 240, 240, 1), size: 22),
|
|
// const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Text(
|
|
item.text,
|
|
style: const TextStyle(color: Color.fromRGBO(253, 252, 252, 1)),
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
static void onChanged(BuildContext context, _MenuItem item) {
|
|
switch (item) {
|
|
case _MenuItems.like:
|
|
//Do something
|
|
break;
|
|
case _MenuItems.share:
|
|
//Do something
|
|
break;
|
|
case _MenuItems.download:
|
|
//Do something
|
|
break;
|
|
case _MenuItems.cancel:
|
|
//Do something
|
|
break;
|
|
}
|
|
}
|
|
}
|