306 lines
11 KiB
Dart
306 lines
11 KiB
Dart
import 'dart:typed_data';
|
|
|
|
import 'package:flutter/material.dart';
|
|
import 'package:freekake/components/bottom_navbar.dart';
|
|
import 'package:freekake/components/main_menu.dart';
|
|
import 'package:freekake/components/point_header.dart';
|
|
import 'package:freekake/components/scan_button.dart';
|
|
import 'package:image_picker/image_picker.dart';
|
|
import 'dart:io';
|
|
|
|
// import 'package:image_picker_web/image_picker_web.dart';
|
|
import 'package:flutter/foundation.dart' show kIsWeb;
|
|
|
|
class PointSaya extends StatefulWidget {
|
|
const PointSaya({super.key});
|
|
|
|
@override
|
|
_PointSayaState createState() => _PointSayaState();
|
|
}
|
|
|
|
class _PointSayaState extends State<PointSaya> {
|
|
dynamic _profileImage;
|
|
dynamic _headerImage;
|
|
ImageProvider? imageProvider;
|
|
|
|
final ImagePicker _picker = ImagePicker();
|
|
|
|
Future<void> _pickImage(bool isProfile) async {
|
|
if (kIsWeb) {
|
|
// Uint8List? bytesFromPicker = await ImagePickerWeb.getImageAsBytes();
|
|
// if (bytesFromPicker != null) {
|
|
// setState(() {
|
|
// if (isProfile) {
|
|
// _profileImage = bytesFromPicker;
|
|
// } else {
|
|
// _headerImage = bytesFromPicker;
|
|
// }
|
|
// });
|
|
// }
|
|
} else {
|
|
final pickedFile = await _picker.pickImage(source: ImageSource.gallery);
|
|
if (pickedFile != null) {
|
|
final imageFile = File(pickedFile.path);
|
|
setState(() {
|
|
if (isProfile) {
|
|
_profileImage = imageFile;
|
|
} else {
|
|
_headerImage = imageFile;
|
|
}
|
|
|
|
imageProvider =
|
|
kIsWeb ? MemoryImage(_profileImage) : FileImage(_profileImage);
|
|
});
|
|
} else {
|
|
imageProvider = AssetImage("assets/images/luffy.png");
|
|
}
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: AppBar(
|
|
title: Text("Point Saya"),
|
|
backgroundColor: Color.fromARGB(225, 79, 76, 182),
|
|
),
|
|
resizeToAvoidBottomInset: false,
|
|
backgroundColor: const Color.fromARGB(255, 255, 255, 255),
|
|
body: Stack(
|
|
children: [
|
|
Align(
|
|
alignment: Alignment.bottomCenter,
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(top: 0.0, left: 20, right: 20),
|
|
child: Container(
|
|
height: MediaQuery.of(context).size.height * 0.7,
|
|
width: MediaQuery.of(context).size.width,
|
|
decoration: BoxDecoration(
|
|
color: const Color.fromARGB(150, 137, 123, 69),
|
|
borderRadius: BorderRadius.only(
|
|
topLeft: Radius.circular(20),
|
|
topRight: Radius.circular(20),
|
|
),
|
|
),
|
|
child: Column(
|
|
spacing: 10,
|
|
children: [
|
|
SizedBox(height: 4),
|
|
Padding(
|
|
padding: const EdgeInsets.all(8.0),
|
|
child: Container(
|
|
padding: EdgeInsets.symmetric(
|
|
horizontal: 20,
|
|
vertical: 10,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: const Color.fromARGB(255, 191, 184, 184),
|
|
borderRadius: BorderRadius.circular(10),
|
|
boxShadow: [
|
|
BoxShadow(color: Colors.black12, blurRadius: 8),
|
|
],
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
SizedBox(height: 5),
|
|
Row(
|
|
children: [
|
|
// Image.asset(
|
|
// 'assets/icons/diamond.png',
|
|
// width: 24,
|
|
// ),
|
|
Text(
|
|
"Total Point",
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black87,
|
|
),
|
|
),
|
|
SizedBox(width: 8),
|
|
Text(
|
|
"300",
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black87,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
Row(
|
|
children: [
|
|
// Image.asset('assets/icons/coin.png', width: 24),
|
|
Text(
|
|
"Total Koin",
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black87,
|
|
),
|
|
),
|
|
SizedBox(width: 8),
|
|
Text(
|
|
"60",
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black87,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 5),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Padding(padding: EdgeInsets.all(8)),
|
|
Container(
|
|
width: MediaQuery.of(context).size.width * 0.8,
|
|
child: Center(
|
|
child: Text(
|
|
"Riwayat poin dan koin",
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.white60,
|
|
),
|
|
),
|
|
),
|
|
// color: Colors.amber,
|
|
),
|
|
],
|
|
),
|
|
PointsHeader(),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
children: [
|
|
SizedBox(width: 40),
|
|
Text("Furikake", style: TextStyle(color: Colors.white)),
|
|
SizedBox(width: 130),
|
|
Text(
|
|
"",
|
|
// "🔥 Level: ${points.level}",
|
|
// style: TextStyle(color: Colors.orangeAccent),
|
|
),
|
|
Text("100", style: TextStyle(color: Colors.lightBlue)),
|
|
SizedBox(width: 60),
|
|
Text("20", style: TextStyle(color: Colors.greenAccent)),
|
|
],
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
children: [
|
|
SizedBox(width: 40),
|
|
Text("Furikake", style: TextStyle(color: Colors.white)),
|
|
SizedBox(width: 130),
|
|
Text(
|
|
"",
|
|
// "🔥 Level: ${points.level}",
|
|
// style: TextStyle(color: Colors.orangeAccent),
|
|
),
|
|
Text("100", style: TextStyle(color: Colors.lightBlue)),
|
|
SizedBox(width: 60),
|
|
Text("20", style: TextStyle(color: Colors.greenAccent)),
|
|
],
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
children: [
|
|
SizedBox(width: 40),
|
|
Text("Furikake", style: TextStyle(color: Colors.white)),
|
|
SizedBox(width: 130),
|
|
Text(
|
|
"",
|
|
// "🔥 Level: ${points.level}",
|
|
// style: TextStyle(color: Colors.orangeAccent),
|
|
),
|
|
Text("100", style: TextStyle(color: Colors.lightBlue)),
|
|
SizedBox(width: 60),
|
|
Text("20", style: TextStyle(color: Colors.greenAccent)),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
// Profile Picture (bisa diubah)
|
|
Positioned(
|
|
top: 25,
|
|
left: MediaQuery.of(context).size.width / 2 - 50,
|
|
child: GestureDetector(
|
|
onTap: () => _pickImage(true),
|
|
child: Stack(
|
|
alignment: Alignment.bottomRight,
|
|
children: [
|
|
CircleAvatar(
|
|
radius: 50,
|
|
backgroundColor: Colors.grey[300],
|
|
backgroundImage:
|
|
_profileImage != null
|
|
? (kIsWeb
|
|
? MemoryImage(_profileImage) as ImageProvider
|
|
: FileImage(_profileImage) as ImageProvider)
|
|
: null,
|
|
child:
|
|
_profileImage == null
|
|
? Image.asset("assets/images/luffy.png")
|
|
: null,
|
|
),
|
|
CircleAvatar(
|
|
radius: 15,
|
|
backgroundColor: Colors.blue,
|
|
child: Icon(Icons.edit, color: Colors.white, size: 15),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
|
|
Positioned(
|
|
top: 130,
|
|
left: MediaQuery.of(context).size.width / 2 - 30,
|
|
child: GestureDetector(
|
|
onTap: () => _pickImage(true),
|
|
child: Stack(
|
|
alignment: Alignment.bottomRight,
|
|
children: [
|
|
Text(
|
|
"Luffy kun",
|
|
style: TextStyle(
|
|
color: Colors.deepPurple,
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildListItem(IconData icon, String label, {bool isLogout = false}) {
|
|
return ListTile(
|
|
leading: Icon(
|
|
icon,
|
|
color:
|
|
isLogout
|
|
? const Color.fromARGB(255, 181, 47, 47)
|
|
: const Color.fromARGB(255, 255, 255, 255),
|
|
),
|
|
title: Text(label, style: TextStyle(fontSize: 16, color: Colors.black)),
|
|
trailing: Icon(Icons.arrow_forward_ios, size: 16),
|
|
onTap: () {},
|
|
);
|
|
}
|
|
}
|