step 8 : slicing home screen fix
This commit is contained in:
BIN
images/iconbarcode.png
Normal file
BIN
images/iconbarcode.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
images/icongender.png
Normal file
BIN
images/icongender.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
@@ -18,12 +18,10 @@ class Constant {
|
||||
static Color bgRed = const Color(0xffFF4842).withOpacity(0.08);
|
||||
static Color bgGrey = const Color(0xffF9F9F9);
|
||||
static Color bgBlue = Colors.blue;
|
||||
static Color bgIcon = const Color(0xffA8CF45);
|
||||
static Color textCardGrey = const Color.fromRGBO(0, 0, 0, 0.60);
|
||||
|
||||
static Color textTrueBlack = const Color(0xff000000);
|
||||
static Color textBlack = const Color(0xff212B36);
|
||||
static Color textLightGrey = const Color(0xff919EAB);
|
||||
static Color textOrange = const Color(0xffF15A29);
|
||||
static Color textDarkGrey = const Color(0xff637381);
|
||||
static Color textWhite = Color(0xffFDFDFD);
|
||||
static Color textRed = Color(0xffFF4842);
|
||||
// background upload file
|
||||
@@ -45,6 +43,20 @@ class Constant {
|
||||
}
|
||||
|
||||
// typography
|
||||
static TextStyle titleRiwayat({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 20),
|
||||
fontWeight: FontWeight.w500,
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle cardText({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 14),
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle title_700({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 36),
|
||||
@@ -66,6 +78,13 @@ class Constant {
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle titleInputan600({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 16),
|
||||
fontWeight: FontWeight.w600,
|
||||
);
|
||||
}
|
||||
|
||||
static TextStyle titleButton500({required BuildContext context}) {
|
||||
return TextStyle(
|
||||
fontSize: Constant.getActualYPhone(context: context, y: 15),
|
||||
|
||||
145
lib/screen/home/card_riwayat_scan.dart
Normal file
145
lib/screen/home/card_riwayat_scan.dart
Normal file
@@ -0,0 +1,145 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
|
||||
import '../../app/constant.dart';
|
||||
|
||||
class CardRiwayatScan extends HookConsumerWidget {
|
||||
const CardRiwayatScan({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [
|
||||
SystemUiOverlay.bottom,
|
||||
]);
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
FocusManager.instance.primaryFocus!.unfocus();
|
||||
},
|
||||
child: Card(
|
||||
elevation: 2,
|
||||
color: Constant.textWhite,
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(
|
||||
Constant.getActualYPhone(context: context, y: 12),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'3171234567890123',
|
||||
style: Constant.titleInputan600(context: context).copyWith(
|
||||
color: Constant.textBlack,
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
Icons.edit,
|
||||
color: Constant.bgButton,
|
||||
size: 20,
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 12,
|
||||
),
|
||||
),
|
||||
// row nama
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.person_2_outlined,
|
||||
color: Constant.bgIcon,
|
||||
size: 20,
|
||||
),
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 8,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'MIRA SETIAWAN',
|
||||
style: Constant.cardText(context: context).copyWith(
|
||||
color: Constant.textCardGrey,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// row nama
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 10,
|
||||
),
|
||||
),
|
||||
// row dob
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.date_range_outlined,
|
||||
color: Constant.bgIcon,
|
||||
size: 20,
|
||||
),
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 8,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'18-02-1996',
|
||||
style: Constant.cardText(context: context).copyWith(
|
||||
color: Constant.textCardGrey,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// row dob
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 10,
|
||||
),
|
||||
),
|
||||
// row jenis kelamin
|
||||
Row(
|
||||
children: [
|
||||
Image.asset(
|
||||
'images/icongender.png',
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 20,
|
||||
),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 20,
|
||||
),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
SizedBox(
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 8,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'Perempuan',
|
||||
style: Constant.cardText(context: context).copyWith(
|
||||
color: Constant.textCardGrey,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// row jenis kelamin
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,8 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:scanktpflutter/screen/home/card_riwayat_scan.dart';
|
||||
|
||||
import '../../app/constant.dart';
|
||||
import '../../app/route.dart';
|
||||
@@ -11,6 +13,10 @@ class HomeScreen extends HookConsumerWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [
|
||||
SystemUiOverlay.bottom,
|
||||
]);
|
||||
|
||||
final currentUser = ref.watch(currentUserProvider);
|
||||
|
||||
useEffect(() {
|
||||
@@ -51,7 +57,6 @@ class HomeScreen extends HookConsumerWidget {
|
||||
y: 34,
|
||||
),
|
||||
),
|
||||
Text(username),
|
||||
// button scan ktp
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
@@ -83,14 +88,23 @@ class HomeScreen extends HookConsumerWidget {
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.scanner,
|
||||
color: Constant.textWhite,
|
||||
size: 24,
|
||||
Image.asset(
|
||||
'images/iconbarcode.png',
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 20,
|
||||
),
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 20,
|
||||
),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
SizedBox(
|
||||
width:
|
||||
Constant.getActualXPhone(context: context, x: 10),
|
||||
width: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 10,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'SCAN KTP BARU',
|
||||
@@ -104,6 +118,57 @@ class HomeScreen extends HookConsumerWidget {
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 56,
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: EdgeInsets.only(
|
||||
left: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 20,
|
||||
),
|
||||
right: Constant.getActualXPhone(
|
||||
context: context,
|
||||
x: 20,
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'Riwayat',
|
||||
style:
|
||||
Constant.titleRiwayat(context: context).copyWith(
|
||||
color: Constant.textBlack,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'20 Scan Terakhir',
|
||||
style: Constant.titleInputan500(context: context)
|
||||
.copyWith(
|
||||
color: Constant.inputanGrey,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: Constant.getActualYPhone(
|
||||
context: context,
|
||||
y: 24,
|
||||
),
|
||||
),
|
||||
|
||||
// card riwayat
|
||||
CardRiwayatScan(),
|
||||
// card riwayat
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
@@ -1,12 +1,8 @@
|
||||
import 'dart:convert';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:scanktpflutter/app/route.dart';
|
||||
import 'package:scanktpflutter/model/auth_model.dart';
|
||||
import 'package:shared_preferences/shared_preferences.dart';
|
||||
|
||||
import '../../app/constant.dart';
|
||||
import '../../provider/current_user_provider.dart';
|
||||
|
||||
@@ -160,6 +160,14 @@ packages:
|
||||
url: "https://pub.dev"
|
||||
source: hosted
|
||||
version: "0.20.2"
|
||||
jiffy:
|
||||
dependency: "direct main"
|
||||
description:
|
||||
name: jiffy
|
||||
sha256: "1c1b86459969ff9f32dc5b0ffe392f1e08181e66396cf9dd8fa7c90552a691af"
|
||||
url: "https://pub.dev"
|
||||
source: hosted
|
||||
version: "6.3.2"
|
||||
leak_tracker:
|
||||
dependency: transitive
|
||||
description:
|
||||
|
||||
@@ -43,6 +43,7 @@ dependencies:
|
||||
shared_preferences: ^2.5.2
|
||||
equatable: ^2.0.7
|
||||
top_snackbar_flutter: ^3.2.0
|
||||
jiffy: ^6.3.1
|
||||
|
||||
dev_dependencies:
|
||||
flutter_test:
|
||||
@@ -73,6 +74,8 @@ flutter:
|
||||
- images/splashatas.png
|
||||
- images/splashbawah.png
|
||||
- images/vektoratas.png
|
||||
- images/icongender.png
|
||||
- images/iconbarcode.png
|
||||
|
||||
# An image asset can refer to one or more resolution-specific "variants", see
|
||||
# https://flutter.dev/to/resolution-aware-images
|
||||
|
||||
Reference in New Issue
Block a user