sindhu/absensi_sas_flutter
1
0
Fork 0
Code Issues 6 Pull Requests Packages Projects Releases Wiki Activity

[Homepage] 4. add card time on Homepage screen

Browse Source
This commit is contained in:
Stephen
2024-01-11 14:58:37 +07:00
parent 9cff5e1db8
commit ce0b753da5
3 changed files with 147 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
lib/screen/homepage/homepage_screen.dart Normal file
View File

@@ -0,0 +1,131 @@
import 'package:absensi_sas_flutter/app/constant.dart';
import 'package:absensi_sas_flutter/screen/widget/real_date.dart';
import 'package:absensi_sas_flutter/screen/widget/real_time.dart';
import 'package:flutter/material.dart';
class HomepageScreen extends StatelessWidget {
const HomepageScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Column(
children: [
SizedBox(
height: Constant.getActualYPhone(context: context, y: 44),
),
//Card Time
Padding(
padding: EdgeInsets.only(
left: Constant.getActualXPhone(context: context, x: 33),
right:Constant.getActualXPhone(context: context, x: 27),
),
child: Container(
child: Card(
elevation: 16,
child: Container(
width: Constant.getActualXPhone(context: context, x: 330),
height: Constant.getActualYPhone(context: context, y: 200),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(40),
image: DecorationImage(
image: AssetImage('images/card_bg_1.png'), // Ganti dengan path gambar Anda
fit: BoxFit.cover, // Sesuaikan cara gambar ditampilkan
),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Date
Padding(
padding: EdgeInsets.only(
top: Constant.getActualYPhone(context: context, y: 16),
left: Constant.getActualXPhone(context: context, x: 83.5),
right:Constant.getActualXPhone(context: context, x: 83.5),
),
child: RealTimeFormattedDate(),
),
SizedBox(height: Constant.getActualYPhone(context: context, y: 8),),
//Time
RealTimeClock(), // Menampilkan waktu real-time menggunakan RealTimeClock
SizedBox(height: Constant.getActualYPhone(context: context, y: 20),),
Row(
mainAxisAlignment: MainAxisAlignment.center, // Menengahkan secara horizontal
children: [
Spacer(), // Spasi di sebelah kiri "Check In"
Column(
children: [
Image.asset(
'images/finger_tap.png', // Path gambar untuk "Check In"
width: Constant.getActualXPhone(context: context, x:22),
height: Constant.getActualYPhone(context: context, y: 22),
),
SizedBox(
height: Constant.getActualYPhone(context: context, y: 8),
),
Text(
'--:--',
style: TextStyle(
// Atur gaya teks '--:--' sesuai kebutuhan
),
),
Text(
'Clock In',
style: Constant.titleH2_700(context: context).copyWith(
color: Constant.textLightGrey,
),
),
],
),
SizedBox(width: Constant.getActualXPhone(context: context, x: 96),), // Jarak antara "Check In" dan "Check Out"
Column(
children: [
Image.asset(
'images/finger_tap.png', // Path gambar untuk "Check Out"
width: Constant.getActualXPhone(context: context, x:22),
height: Constant.getActualYPhone(context: context, y: 22),
),
SizedBox(
height: Constant.getActualYPhone(context: context, y: 8),
),
Text(
'--:--',
style: TextStyle(
// Atur gaya teks '--:--' sesuai kebutuhan
),
),
Text(
'Clock Out',
style: Constant.titleH2_700(context: context).copyWith(
color: Constant.textLightGrey,
),
),
],
),
Spacer(), // Spasi di sebelah kanan "Check Out"
],
),
SizedBox(
height: Constant.getActualYPhone(context: context, y: 16),
),
],
),
),
),
),
),
],
),
),
);
}
}