diff --git a/assets/html/furikake/index.html b/assets/html/furikake/index.html index 0f211ac..6654826 100644 --- a/assets/html/furikake/index.html +++ b/assets/html/furikake/index.html @@ -93,7 +93,7 @@ img { border-radius: 4px; } -.bahan-container { +.div-grid { display: flex; flex-wrap: wrap; justify-content: center; @@ -101,21 +101,21 @@ img { margin: 20px 0; } -.bahan-item { +.div-item { text-align: center; flex: 1 0 calc(25% - 15px); /* 4 items per row by default */ min-width: calc(25% - 15px); max-width: calc(25% - 15px); } -.bahan-item img { +.div-item img { width: 100%; height: 120px; object-fit: cover; border-radius: 8px; } -.bahan-item p { +.div-item p { margin-top: 8px; font-size: 0.9em; } @@ -138,7 +138,7 @@ figcaption { /* Tablet Size (768px and below) - 2 items per row */ @media (max-width: 768px) { - .bahan-item { + .div-item { flex: 1 0 calc(50% - 15px); min-width: calc(50% - 15px); max-width: calc(50% - 15px); @@ -171,7 +171,7 @@ figcaption { padding: 15px; } - .bahan-item { + .div-item { flex: 1 0 100%; min-width: 100%; max-width: 100%; @@ -222,20 +222,20 @@ figcaption {

Apa Saja Isi Furikake?

Furikake biasanya terbuat dari campuran beberapa bahan seperti:

-
-
+
+
Nori

Nori (Rumput Laut)

-
+
Biji Wijen

Biji Wijen

-
+
Katsuobushi

Katsuobushi (Ikan Kering)

-
+
Garam dan Gula

Garam & Gula

@@ -259,7 +259,7 @@ figcaption {
- Contoh produk furikake + Contoh produk furikake
Berbagai varian produk furikake yang tersedia di pasaran
diff --git a/assets/html/index.html b/assets/html/index.html index 78c988f..16b8143 100644 --- a/assets/html/index.html +++ b/assets/html/index.html @@ -92,7 +92,7 @@ border-radius: 4px; } - .gizi-grid { + .div-grid { display: flex; flex-wrap: wrap; justify-content: center; @@ -100,13 +100,13 @@ margin-top: 5px; } - .gizi-item { + .div-item { text-align: center; max-width: 100px; flex: 1 1 200px; } - .gizi-item img { + .div-item img { width: 100%; height: auto; border-radius: 10px; @@ -148,12 +148,12 @@ padding: 15px; } - .gizi-grid { + .div-grid { flex-direction: column; align-items: center; } - .gizi-item { + .div-item { max-width: 80%; } } @@ -175,24 +175,24 @@

Apa Itu Gizi Seimbang?

Gizi seimbang adalah cara makan yang mengandung semua zat gizi yang dibutuhkan tubuh. Zat gizi itu terdiri dari:

-
-
+
+
Karbohidrat

Karbohidrat
Sumber energi seperti nasi, roti, dan kentang.

-
+
Protein

Protein
Untuk membangun otot, misalnya ikan, telur, dan tahu.

-
+
Lemak

Lemak
Memberikan tenaga, seperti dari kacang-kacangan dan minyak sehat.

-
+
Vitamin dan Mineral

Vitamin dan mineral
Dari sayur dan buah yang membantu tubuh bekerja dengan baik.

-
+
Serat dan Air

Serat dan air
Membantu pencernaan dan menjaga tubuh tetap segar!

diff --git a/lib/components/bottom_navbar.dart b/lib/components/bottom_navbar.dart index b9e7e67..29426c7 100644 --- a/lib/components/bottom_navbar.dart +++ b/lib/components/bottom_navbar.dart @@ -1,9 +1,5 @@ +import 'package:freekake/components/navbar_shape_3.dart'; import 'package:flutter/material.dart'; -import 'package:furibase/components/navbar_container.dart'; -import 'package:furibase/components/navbar_shape_1.dart'; -import 'package:furibase/components/navbar_shape_2.dart'; -import 'package:furibase/components/navbar_shape_3.dart'; -import 'package:furibase/components/custom_shape.dart'; class BottomNavbar extends StatefulWidget { const BottomNavbar({super.key}); @@ -13,6 +9,7 @@ class BottomNavbar extends StatefulWidget { } class _BottomNavbarState extends State { + @override Widget build(BuildContext context) { final Size screenSize = MediaQuery.of(context).size; return CustomPaint( diff --git a/lib/components/card_list.dart b/lib/components/card_list.dart index 49740d2..12582d8 100644 --- a/lib/components/card_list.dart +++ b/lib/components/card_list.dart @@ -34,7 +34,7 @@ class CardList extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - this.title, + title, style: const TextStyle( fontSize: 14, fontWeight: FontWeight.bold, diff --git a/lib/components/collection_container.dart b/lib/components/collection_container.dart index a6508b6..59c4879 100644 --- a/lib/components/collection_container.dart +++ b/lib/components/collection_container.dart @@ -17,7 +17,7 @@ class CollectionContainer extends StatelessWidget { final bool? small; const CollectionContainer({ - Key? key, + super.key, this.label, this.imagesrc, this.imageSvg, @@ -31,7 +31,7 @@ class CollectionContainer extends StatelessWidget { this.circle, this.colorContiner, this.small, - }) : super(key: key); + }); @override Widget build(BuildContext context) { diff --git a/lib/components/curve_bottom_border_tab.dart b/lib/components/curve_bottom_border_tab.dart index 84d2dac..8f0b33a 100644 --- a/lib/components/curve_bottom_border_tab.dart +++ b/lib/components/curve_bottom_border_tab.dart @@ -6,6 +6,7 @@ class CurvedBottomBorderTab extends StatelessWidget { final VoidCallback tap; const CurvedBottomBorderTab({ + super.key, required this.isSelected, required this.label, required this.tap, @@ -16,6 +17,7 @@ class CurvedBottomBorderTab extends StatelessWidget { return CustomPaint( painter: isSelected ? CurvedBottomPainter() : null, child: GestureDetector( + onTap: tap, child: Container( width: 110, padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16), @@ -34,7 +36,6 @@ class CurvedBottomBorderTab extends StatelessWidget { ), ), ), - onTap: tap, ), ); } diff --git a/lib/components/custom_shape.dart b/lib/components/custom_shape.dart index 345c6e5..28c4828 100644 --- a/lib/components/custom_shape.dart +++ b/lib/components/custom_shape.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/navbar_shape_2.dart'; +// import 'package:freekake/components/navbar_shape_2.dart'; class CustomShape extends StatelessWidget { const CustomShape({super.key}); @@ -23,7 +23,7 @@ class RPSCustomPainter extends CustomPainter { void paint(Canvas canvas, Size size) { // Layer 1 - Paint paint_fill_0 = + Paint paintFill0 = Paint() ..color = const Color.fromARGB(255, 189, 18, 18) ..style = PaintingStyle.fill @@ -67,11 +67,11 @@ class RPSCustomPainter extends CustomPainter { ); path_0.close(); - canvas.drawPath(path_0, paint_fill_0); + canvas.drawPath(path_0, paintFill0); // Layer 1 - Paint paint_stroke_0 = + Paint paintStroke0 = Paint() ..color = const Color.fromARGB(255, 33, 150, 243) ..style = PaintingStyle.stroke @@ -79,11 +79,11 @@ class RPSCustomPainter extends CustomPainter { ..strokeCap = StrokeCap.butt ..strokeJoin = StrokeJoin.miter; - canvas.drawPath(path_0, paint_stroke_0); + canvas.drawPath(path_0, paintStroke0); // Layer 1 - Paint paint_fill_1 = + Paint paintFill1 = Paint() ..color = const Color.fromARGB(255, 28, 163, 52) ..style = PaintingStyle.fill @@ -116,11 +116,11 @@ class RPSCustomPainter extends CustomPainter { ); path_1.close(); - canvas.drawPath(path_1, paint_fill_1); + canvas.drawPath(path_1, paintFill1); // Layer 1 - Paint paint_stroke_1 = + Paint paintStroke1 = Paint() ..color = const Color.fromARGB(255, 33, 150, 243) ..style = PaintingStyle.stroke @@ -128,7 +128,7 @@ class RPSCustomPainter extends CustomPainter { ..strokeCap = StrokeCap.butt ..strokeJoin = StrokeJoin.miter; - canvas.drawPath(path_1, paint_stroke_1); + canvas.drawPath(path_1, paintStroke1); // layer 2 // Paint paint_fill_0 = @@ -164,7 +164,7 @@ class RPSCustomPainter extends CustomPainter { ); path_0.close(); - canvas.drawPath(path_0, paint_fill_0); + canvas.drawPath(path_0, paintFill0); // Layer 1 diff --git a/lib/components/main_menu.dart b/lib/components/main_menu.dart index 5c572a6..0a1314b 100644 --- a/lib/components/main_menu.dart +++ b/lib/components/main_menu.dart @@ -1,16 +1,15 @@ +import 'package:freekake/components/menu_button.dart'; +import 'package:freekake/providers/menu_selection_provider.dart'; +import 'package:freekake/screen/Home_screen.dart'; +import 'package:freekake/screen/koleksi_screen.dart'; +import 'package:freekake/screen/pustaka_screen.dart'; +import 'package:freekake/screen/saya/profile_screen.dart'; import 'package:flutter/material.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/menu_button.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/providers/menu_selection_provider.dart'; -import 'package:furibase/screen/Home_screen.dart'; -import 'package:furibase/screen/koleksi_screen.dart'; -import 'package:furibase/screen/pustaka_screen.dart'; -import 'package:furibase/screen/saya/profile_screen.dart'; import 'package:provider/provider.dart'; class MainMenu extends StatefulWidget { const MainMenu({super.key}); + @override _MainMenuState createState() => _MainMenuState(); } diff --git a/lib/components/navbar_container.dart b/lib/components/navbar_container.dart index 418e0f4..a5e9690 100644 --- a/lib/components/navbar_container.dart +++ b/lib/components/navbar_container.dart @@ -1,5 +1,4 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/navbar_shape_2.dart'; class NavbarContainer extends StatelessWidget { const NavbarContainer({super.key}); @@ -23,7 +22,7 @@ class MyShape extends CustomPainter { void paint(Canvas canvas, Size size) { // TODO: implement paint Paint paint = - new Paint() + Paint() ..color = const Color.fromARGB(255, 166, 12, 66) ..style = PaintingStyle.fill; diff --git a/lib/components/navbar_shape_2.dart b/lib/components/navbar_shape_2.dart index 3deef7a..a602937 100644 --- a/lib/components/navbar_shape_2.dart +++ b/lib/components/navbar_shape_2.dart @@ -7,7 +7,7 @@ class BNBCustomPainter2 extends CustomPainter { void paint(Canvas canvas, Size size) { debugPrint("Drawing navbar..."); Paint paint = - new Paint() + Paint() ..color = const Color.fromARGB(255, 79, 76, 182) ..style = PaintingStyle.fill; diff --git a/lib/components/navbar_shape_3.dart b/lib/components/navbar_shape_3.dart index b5157f5..735ed68 100644 --- a/lib/components/navbar_shape_3.dart +++ b/lib/components/navbar_shape_3.dart @@ -7,7 +7,7 @@ class BNBCustomPainter3 extends CustomPainter { void paint(Canvas canvas, Size size) { debugPrint("Drawing navbar..."); Paint paint = - new Paint() + Paint() ..color = const Color.fromARGB(255, 79, 76, 182) ..style = PaintingStyle.fill; diff --git a/lib/components/scan_button.dart b/lib/components/scan_button.dart index 075b425..49bbab6 100644 --- a/lib/components/scan_button.dart +++ b/lib/components/scan_button.dart @@ -1,10 +1,11 @@ +import 'package:freekake/screen/camera_screen.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:furibase/screen/camera_screen.dart'; +// import 'package:freekake/screen/camera_screen.dart'; class ScanButton extends StatelessWidget { const ScanButton({super.key}); - static const Color transparent = Color(0xFFFFFFF); + static const Color transparent = Color(0x0fffffff); @override Widget build(BuildContext context) { diff --git a/lib/components/topbar_container.dart b/lib/components/topbar_container.dart index d9bbbd7..54d69a4 100644 --- a/lib/components/topbar_container.dart +++ b/lib/components/topbar_container.dart @@ -8,6 +8,7 @@ class TopbarContainer extends StatefulWidget { } class _TopbarContainerState extends State { + @override Widget build(BuildContext context) { final Size size = MediaQuery.of(context).size; return Container( diff --git a/lib/main.dart b/lib/main.dart index 44ad66a..caeca33 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; -import 'package:furibase/providers/character_provider.dart'; -import 'package:furibase/providers/menu_selection_provider.dart'; -import 'package:furibase/screen/Home_screen.dart'; +import 'package:freekake/providers/character_provider.dart'; +import 'package:freekake/providers/menu_selection_provider.dart'; +import 'package:freekake/screen/Home_screen.dart'; import 'package:provider/provider.dart'; void main() async { diff --git a/lib/screen/Home_screen.dart b/lib/screen/Home_screen.dart index 8704ea2..ef7ede9 100644 --- a/lib/screen/Home_screen.dart +++ b/lib/screen/Home_screen.dart @@ -1,12 +1,12 @@ 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'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; class HomeScreen extends StatefulWidget { - HomeScreen({super.key}); + const HomeScreen({super.key}); @override State createState() => _HomeScreenState(); @@ -14,7 +14,7 @@ class HomeScreen extends StatefulWidget { class _HomeScreenState extends State { final String username = "User01"; - double _sliderValue = 0.0; + final double _sliderValue = 0.0; static const Color transparent = Color(0xFFFFFFFF); // Image image @@ -77,235 +77,214 @@ class _HomeScreenState extends State { // ], // ), // ), - body: Stack( - children: [ - 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( - // 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), - ], - ), - ), - // 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: -150, //bottomPadding * 32, - // bottom: sunRiseCurve( - // screenWidth, - // ), - bottom: - isLandscape - ? bottomOffset.clamp(-200.0, -50.0) - : bottomPadding * 55, - left: (screenWidth - buttonScanSize) / 2, - child: Transform.translate( - offset: Offset(0, -30), - child: ScanButton(), - ), - ), - ], + body: homeBody( + context, + isLandscape, + bottomOffset, + bottomPadding, + screenWidth, + buttonScanSize, ), ); } - // 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, - // ), - // ), - // ], - // ), - // ); - // } + Stack homeBody( + BuildContext context, + bool isLandscape, + double bottomOffset, + double bottomPadding, + double screenWidth, + double buttonScanSize, + ) { + return Stack( + children: [ + Positioned.fill( + child: RepaintBoundary( + child: Container( + decoration: const BoxDecoration( + image: 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( + // 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), + ], + ), + ), + // 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()), - // 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: () {}, - // ), - // ), - // ); - // } + Positioned( + // bottom: -150, //bottomPadding * 32, + // bottom: sunRiseCurve( + // screenWidth, + // ), + bottom: + isLandscape + ? bottomOffset.clamp(-200.0, -50.0) + : bottomPadding * 55, + left: (screenWidth - buttonScanSize) / 2, + child: Transform.translate( + offset: Offset(0, -30), + child: ScanButton(), + ), + ), + ], + ); + } Widget setHomeImage(String src, double size) { return Image.asset(src, width: size); diff --git a/lib/screen/camera_screen.dart b/lib/screen/camera_screen.dart index 8085fd7..e5651c4 100644 --- a/lib/screen/camera_screen.dart +++ b/lib/screen/camera_screen.dart @@ -5,6 +5,8 @@ import 'package:flutter/material.dart'; import 'package:permission_handler/permission_handler.dart'; class CameraScreen extends StatefulWidget { + const CameraScreen({super.key}); + @override _CameraScreenState createState() => _CameraScreenState(); } diff --git a/lib/screen/collection/character_view.dart b/lib/screen/collection/character_view.dart index 7978a98..5d53166 100644 --- a/lib/screen/collection/character_view.dart +++ b/lib/screen/collection/character_view.dart @@ -8,11 +8,11 @@ class CharacterView extends StatefulWidget { final String content; const CharacterView({ - Key? key, + super.key, required this.title, required this.imagePath, required this.content, - }) : super(key: key); + }); @override _CharacterViewState createState() => _CharacterViewState(); diff --git a/lib/screen/collection/collection_caracter_screen.dart b/lib/screen/collection/collection_caracter_screen.dart index d6629b3..08bfa73 100644 --- a/lib/screen/collection/collection_caracter_screen.dart +++ b/lib/screen/collection/collection_caracter_screen.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/collection_container.dart'; +import 'package:freekake/components/collection_container.dart'; class CollectionCaraterScreen extends StatefulWidget { const CollectionCaraterScreen({super.key}); diff --git a/lib/screen/collection/collection_fragment_screen.dart b/lib/screen/collection/collection_fragment_screen.dart index cf17f8d..8ce622a 100644 --- a/lib/screen/collection/collection_fragment_screen.dart +++ b/lib/screen/collection/collection_fragment_screen.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/collection_container.dart'; -import 'package:furibase/helpers/color_helper.dart'; +import 'package:freekake/components/collection_container.dart'; +import 'package:freekake/helpers/color_helper.dart'; class CollectionFragmentScreen extends StatefulWidget { const CollectionFragmentScreen({super.key}); diff --git a/lib/screen/collection/collection_skin_screen.dart b/lib/screen/collection/collection_skin_screen.dart index 941f5eb..77e684d 100644 --- a/lib/screen/collection/collection_skin_screen.dart +++ b/lib/screen/collection/collection_skin_screen.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/collection_container.dart'; +import 'package:freekake/components/collection_container.dart'; class CollectionSkinScreen extends StatefulWidget { const CollectionSkinScreen({super.key}); @@ -11,7 +11,7 @@ class CollectionSkinScreen extends StatefulWidget { class _CollectionSkinScreenState extends State { @override Widget build(BuildContext context) { - return Container( + return SizedBox( // scrollDirection: Axis.horizontal, height: MediaQuery.of(context).size.height, child: Column( diff --git a/lib/screen/drraw_screen.dart b/lib/screen/drraw_screen.dart index 904ac6a..0eff846 100644 --- a/lib/screen/drraw_screen.dart +++ b/lib/screen/drraw_screen.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/navbar_container.dart'; +import 'package:freekake/components/navbar_container.dart'; class DrawScreen extends StatelessWidget { const DrawScreen({super.key}); diff --git a/lib/screen/koleksi_screen.dart b/lib/screen/koleksi_screen.dart index 5d41cac..32f7ba2 100644 --- a/lib/screen/koleksi_screen.dart +++ b/lib/screen/koleksi_screen.dart @@ -1,14 +1,14 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/curve_bottom_border_tab.dart'; -import 'package:furibase/components/main_menu.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/components/tab_menu.dart'; -import 'package:furibase/components/topbar_container.dart'; -import 'package:furibase/screen/collection/collection_caracter_screen.dart'; -import 'package:furibase/screen/collection/collection_fragment_screen.dart'; -import 'package:furibase/screen/collection/collection_skin_screen.dart'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/curve_bottom_border_tab.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/components/tab_menu.dart'; +import 'package:freekake/components/topbar_container.dart'; +import 'package:freekake/screen/collection/collection_caracter_screen.dart'; +import 'package:freekake/screen/collection/collection_fragment_screen.dart'; +import 'package:freekake/screen/collection/collection_skin_screen.dart'; class KoleksiScreen extends StatefulWidget { const KoleksiScreen({super.key}); @@ -41,127 +41,135 @@ class _KoleksiScreenState extends State { final double bottomPadding = (9000 / screenWidth).clamp(0, 0.2); return Scaffold( extendBody: true, - body: Stack( - children: [ - Positioned.fill( - child: Container(color: const Color.fromARGB(255, 255, 255, 255)), - ), - Positioned.fill( - top: 30, - child: PageView( - controller: _pageController, - onPageChanged: (index) { - setState(() { - _selectedIndex = index; - }); - }, - children: [ - const CollectionCaraterScreen(), - const CollectionSkinScreen(), - const CollectionFragmentScreen(), - ], - ), - ), - // BG MEnu - Stack( + body: koleksiBody(bottomPadding, screenWidth, buttonScanSize), + ); + } + + Stack koleksiBody( + double bottomPadding, + double screenWidth, + double buttonScanSize, + ) { + return Stack( + children: [ + Positioned.fill( + child: Container(color: const Color.fromARGB(255, 255, 255, 255)), + ), + Positioned.fill( + top: 30, + child: PageView( + controller: _pageController, + onPageChanged: (index) { + setState(() { + _selectedIndex = index; + }); + }, children: [ - Positioned( - bottom: 0, - left: 0, - right: 0, - child: SizedBox(height: 85, child: BottomNavbar()), + const CollectionCaraterScreen(), + const CollectionSkinScreen(), + const CollectionFragmentScreen(), + ], + ), + ), + // BG MEnu + Stack( + children: [ + Positioned( + bottom: 0, + left: 0, + right: 0, + child: SizedBox(height: 85, child: BottomNavbar()), + ), + ], + ), + //TopBar + Positioned( + top: 0, + left: 0, + right: 0, + child: SizedBox(height: 130, child: TopbarContainer()), + ), + + Positioned( + top: 10, + left: 10, + right: 10, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + BuildcardInfo( + icon: Icons.person, + text: 'User01', + extraIcon: Icons.emoji_events, + extraText: "5000", + width: 180, + ), + BuildcardInfo( + icon: Icons.monetization_on, + text: "1.300", + width: 90, ), ], ), - //TopBar - Positioned( - top: 0, - left: 0, - right: 0, - child: SizedBox(height: 130, child: TopbarContainer()), - ), - - Positioned( - top: 10, - left: 10, - right: 10, + ), + // Positioned.fill( + // top: 30, + // child: PageView( + // controller: _pageController, + // onPageChanged: (index) { + // setState(() { + // _selectedIndex = index; + // }); + // }, + // children: [ + // const CollectionCaraterScreen(), + // const CollectionSkinScreen(), + // const CollectionFragmentScreen(), + // ], + // ), + // ), + Positioned( + top: 70, + left: 10, + right: 10, + child: Container( + // decoration: const BoxDecoration( + // borderRadius: BorderRadius.all(Radius.circular(20)), + // color: Color.fromARGB(116, 125, 129, 133), + // ), + padding: const EdgeInsets.all(1), child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, + mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ - BuildcardInfo( - icon: Icons.person, - text: 'User01', - extraIcon: Icons.emoji_events, - extraText: "5000", - width: 180, + CurvedBottomBorderTab( + label: "Karakter", + isSelected: _selectedIndex == 0, + tap: () => _onMenuTapped(0), ), - BuildcardInfo( - icon: Icons.monetization_on, - text: "1.300", - width: 90, + CurvedBottomBorderTab( + label: "Skin", + isSelected: _selectedIndex == 1, + tap: () => _onMenuTapped(1), + ), + CurvedBottomBorderTab( + label: "Fragment", + isSelected: _selectedIndex == 2, + tap: () => _onMenuTapped(2), ), ], ), ), - // Positioned.fill( - // top: 30, - // child: PageView( - // controller: _pageController, - // onPageChanged: (index) { - // setState(() { - // _selectedIndex = index; - // }); - // }, - // children: [ - // const CollectionCaraterScreen(), - // const CollectionSkinScreen(), - // const CollectionFragmentScreen(), - // ], - // ), - // ), - Positioned( - top: 70, - left: 10, - right: 10, - child: Container( - // decoration: const BoxDecoration( - // borderRadius: BorderRadius.all(Radius.circular(20)), - // color: Color.fromARGB(116, 125, 129, 133), - // ), - padding: const EdgeInsets.all(1), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceAround, - children: [ - CurvedBottomBorderTab( - label: "Karakter", - isSelected: _selectedIndex == 0, - tap: () => _onMenuTapped(0), - ), - CurvedBottomBorderTab( - label: "Skin", - isSelected: _selectedIndex == 1, - tap: () => _onMenuTapped(1), - ), - CurvedBottomBorderTab( - label: "Fragment", - isSelected: _selectedIndex == 2, - tap: () => _onMenuTapped(2), - ), - ], - ), - ), + ), + Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()), + Positioned( + bottom: bottomPadding * 98, + left: (screenWidth - buttonScanSize) / 2, + child: Transform.translate( + offset: Offset(0, -20), + child: ScanButton(), ), - Positioned(bottom: 0, left: 0, right: 0, child: MainMenu()), - Positioned( - bottom: bottomPadding * 98, - left: (screenWidth - buttonScanSize) / 2, - child: Transform.translate( - offset: Offset(0, -20), - child: ScanButton(), - ), - ), - ], - ), + ), + ], ); } } diff --git a/lib/screen/pustaka/list_education.dart b/lib/screen/pustaka/list_education.dart index d3cfcb2..8c0ec45 100644 --- a/lib/screen/pustaka/list_education.dart +++ b/lib/screen/pustaka/list_education.dart @@ -3,14 +3,14 @@ import 'dart:io'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; -import 'package:furibase/components/card_list.dart'; -import 'package:furibase/components/collection_container%20copy.dart'; -// import 'package:furibase/components/main_menu.dart'; -// import 'package:furibase/components/topbar_container.dart'; -import 'package:furibase/helpers/color_helper.dart'; +import 'package:freekake/components/card_list.dart'; +import 'package:freekake/components/collection_container%20copy.dart'; +// import 'package:freekake/components/main_menu.dart'; +// import 'package:freekake/components/topbar_container.dart'; +import 'package:freekake/helpers/color_helper.dart'; import 'package:list_detail_extension/list_detail_extension.dart'; -// import 'package:furibase/screen/pustaka/pustaka_detail_screen.dart'; +// import 'package:freekake/screen/pustaka/pustaka_detail_screen.dart'; import 'package:webview_flutter/webview_flutter.dart'; import 'package:flutter/foundation.dart' show kIsWeb; @@ -85,7 +85,7 @@ class _ListEducationState extends State { } void _loadContent(String path) async { - if (_shouldShowWebView && _controller != null) { + if (_shouldShowWebView) { if (path.startsWith('http')) { // Load dari Internet _controller.loadRequest(Uri.parse(path)); @@ -124,8 +124,8 @@ class _ListEducationState extends State { @override Widget build(BuildContext context) { - String _searchQuery = ""; - final List> _collections = [ + String searchQuery = ""; + final List> collections = [ { "label": "Kesehatan", "image": "assets/icons/healthy.svg", @@ -153,14 +153,14 @@ class _ListEducationState extends State { ]; final List> filteredCollections = - _collections + collections .where( (item) => item["label"].toLowerCase().contains( - _searchQuery.toLowerCase(), + searchQuery.toLowerCase(), ), ) .toList(); - if (_shouldShowWebView && _controller != null) { + if (_shouldShowWebView) { return Scaffold( appBar: AppBar( backgroundColor: Color.fromARGB(225, 79, 76, 182), @@ -174,215 +174,10 @@ class _ListEducationState extends State { body: Column( children: [ // Header Section - Container( - width: MediaQuery.of(context).size.width, - height: 150, - decoration: BoxDecoration( - color: const Color.fromARGB(225, 79, 76, 182), - borderRadius: BorderRadius.only( - bottomLeft: Radius.circular(25), - bottomRight: Radius.circular(25), - ), - ), - child: Column( - children: [ - Padding( - padding: const EdgeInsets.symmetric( - horizontal: 20, - vertical: 6, - ), - child: Container( - height: 47, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(20), - color: Colors.grey.shade200, - ), - padding: const EdgeInsets.symmetric(horizontal: 10), - child: Row( - children: [ - const Icon( - Icons.search, - color: Color.fromARGB(137, 180, 172, 172), - size: 18, - ), - const SizedBox(width: 8), - Expanded( - child: TextField( - controller: searchController, - onChanged: - filterSearch, // Memanggil filter saat mengetik - style: const TextStyle( - color: Colors.black, - fontSize: 14, - ), - decoration: const InputDecoration( - border: InputBorder.none, - hintText: 'Cari pelajaran...', - hintStyle: TextStyle(color: Colors.black54), - ), - ), - ), - if (searchController.text.isNotEmpty) - IconButton( - icon: const Icon( - Icons.close, - color: Colors.black54, - ), - onPressed: () { - searchController.clear(); - filterSearch(''); - }, - ), - ], - ), - ), - ), - Row( - crossAxisAlignment: CrossAxisAlignment.start, - mainAxisAlignment: MainAxisAlignment.spaceEvenly, - children: - filteredCollections.map((item) { - return CollectionContainer( - label: item["label"]!, - imageSvg: item["image"]!, - iconw: 20, - iconh: 20, - width: 70, - height: 70, - textColor: Colors.black, - lblSize: 10, - colorContiner: ColorHelper.hexToColor( - item["color"], - ), - onTapAc: - () => { - searchController.clear(), - filterByCategory(item["category"]), - }, - ); - }).toList(), - ), - ], - ), - ), + headerContainer(context, filteredCollections), // Collection Items dengan Filter SizedBox(height: 20), - Expanded( - child: Container( - decoration: BoxDecoration( - color: const Color.fromARGB(223, 200, 200, 206), - borderRadius: BorderRadius.only( - topLeft: Radius.circular(25), - topRight: Radius.circular(25), - ), - ), - child: Column( - children: [ - SizedBox(height: 5), - Padding( - padding: EdgeInsets.symmetric( - horizontal: MediaQuery.of(context).size.width / 4, - ), - child: Divider( - color: const Color.fromARGB(255, 255, 255, 255), - thickness: 2, - ), - ), - Expanded( - child: Padding( - padding: const EdgeInsets.symmetric( - horizontal: 10, - // vertical: 10, - ), - child: - filteredItems.isEmpty - ? const Center( - child: Text( - "Tidak ada hasil", - style: TextStyle( - fontSize: 16, - color: Colors.black54, - ), - ), - ) - : Padding( - padding: EdgeInsets.only( - top: 10.0, - left: 10, - right: 10, - ), - child: Container( - decoration: BoxDecoration( - borderRadius: BorderRadius.only( - topLeft: Radius.circular(20), - topRight: Radius.circular(20), - ), - color: const Color.fromARGB( - 255, - 222, - 181, - 133, - ), - ), - child: Padding( - padding: EdgeInsets.only( - top: 12, - right: 20, - left: 20, - ), - child: GridView.builder( - gridDelegate: - const SliverGridDelegateWithFixedCrossAxisCount( - crossAxisCount: 1, // 2 Kolom - crossAxisSpacing: 10, - mainAxisSpacing: 10, - childAspectRatio: 2.5, - ), - itemCount: _listContent.length, - itemBuilder: (context, index) { - return GestureDetector( - child: CardList( - title: - _listContent[index]["title"] ?? - "", - body: - _listContent[index]["body"] ?? - "", - ), - onTap: () { - Navigator.push( - context, - MaterialPageRoute( - builder: - ( - context, - ) => listDetailExtension.buildPage({ - 'title': - filteredItems[index]['category'], - 'imagePath': - filteredItems[index]['image'], - 'filepath': - filteredItems[index]['file'], - 'paragraphs': - """ - """ + - "

${_listContent[index]["title"]}

${_listContent[index]["body"]}", - }), - ), - ); - }, - ); - }, - ), - ), - ), - ), - ), - ), - ], - ), - ), - ), + Expanded(child: contentContainer(context)), ], ), ); @@ -395,4 +190,194 @@ class _ListEducationState extends State { ); } } + + Container headerContainer( + BuildContext context, + List> filteredCollections, + ) { + return Container( + width: MediaQuery.of(context).size.width, + height: 150, + decoration: BoxDecoration( + color: const Color.fromARGB(225, 79, 76, 182), + borderRadius: BorderRadius.only( + bottomLeft: Radius.circular(25), + bottomRight: Radius.circular(25), + ), + ), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 6), + child: Container( + height: 47, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(20), + color: Colors.grey.shade200, + ), + padding: const EdgeInsets.symmetric(horizontal: 10), + child: Row( + children: [ + const Icon( + Icons.search, + color: Color.fromARGB(137, 180, 172, 172), + size: 18, + ), + const SizedBox(width: 8), + Expanded( + child: TextField( + controller: searchController, + onChanged: filterSearch, // Memanggil filter saat mengetik + style: const TextStyle(color: Colors.black, fontSize: 14), + decoration: const InputDecoration( + border: InputBorder.none, + hintText: 'Cari pelajaran...', + hintStyle: TextStyle(color: Colors.black54), + ), + ), + ), + if (searchController.text.isNotEmpty) + IconButton( + icon: const Icon(Icons.close, color: Colors.black54), + onPressed: () { + searchController.clear(); + filterSearch(''); + }, + ), + ], + ), + ), + ), + Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: + filteredCollections.map((item) { + return CollectionContainer( + label: item["label"]!, + imageSvg: item["image"]!, + iconw: 20, + iconh: 20, + width: 70, + height: 70, + textColor: Colors.black, + lblSize: 10, + colorContiner: ColorHelper.hexToColor(item["color"]), + onTapAc: + () => { + searchController.clear(), + filterByCategory(item["category"]), + }, + ); + }).toList(), + ), + ], + ), + ); + } + + Container contentContainer(BuildContext context) { + return Container( + decoration: BoxDecoration( + color: const Color.fromARGB(223, 200, 200, 206), + borderRadius: BorderRadius.only( + topLeft: Radius.circular(25), + topRight: Radius.circular(25), + ), + ), + child: Column( + children: [ + SizedBox(height: 5), + Padding( + padding: EdgeInsets.symmetric( + horizontal: MediaQuery.of(context).size.width / 4, + ), + child: Divider( + color: const Color.fromARGB(255, 255, 255, 255), + thickness: 2, + ), + ), + Expanded( + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 10, + // vertical: 10, + ), + child: + filteredItems.isEmpty + ? const Center( + child: Text( + "Tidak ada hasil", + style: TextStyle(fontSize: 16, color: Colors.black54), + ), + ) + : Padding( + padding: EdgeInsets.only( + top: 10.0, + left: 10, + right: 10, + ), + child: Container( + decoration: BoxDecoration( + borderRadius: BorderRadius.only( + topLeft: Radius.circular(20), + topRight: Radius.circular(20), + ), + color: const Color.fromARGB(255, 222, 181, 133), + ), + child: Padding( + padding: EdgeInsets.only( + top: 12, + right: 20, + left: 20, + ), + child: GridView.builder( + gridDelegate: + const SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 1, // 2 Kolom + crossAxisSpacing: 10, + mainAxisSpacing: 10, + childAspectRatio: 2.5, + ), + itemCount: _listContent.length, + itemBuilder: (context, index) { + return GestureDetector( + child: CardList( + title: _listContent[index]["title"] ?? "", + body: _listContent[index]["body"] ?? "", + ), + onTap: () { + Navigator.push( + context, + MaterialPageRoute( + builder: + ( + context, + ) => listDetailExtension.buildPage({ + 'title': + filteredItems[index]['category'], + 'imagePath': + filteredItems[index]['image'], + 'filepath': + filteredItems[index]['file'], + 'paragraphs': + """ + """ + "

${_listContent[index]["title"]}

${_listContent[index]["body"]}", + }), + ), + ); + }, + ); + }, + ), + ), + ), + ), + ), + ), + ], + ), + ); + } } diff --git a/lib/screen/pustaka/pustaka_detail_screen copy.dart b/lib/screen/pustaka/pustaka_detail_screen copy.dart index 4a7f622..e8a984f 100644 --- a/lib/screen/pustaka/pustaka_detail_screen copy.dart +++ b/lib/screen/pustaka/pustaka_detail_screen copy.dart @@ -1,6 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/collection_container.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/collection_container.dart'; class DetailScreen extends StatefulWidget { final String title; diff --git a/lib/screen/pustaka/pustaka_detail_screen.dart b/lib/screen/pustaka/pustaka_detail_screen.dart index 992500f..f8f355d 100644 --- a/lib/screen/pustaka/pustaka_detail_screen.dart +++ b/lib/screen/pustaka/pustaka_detail_screen.dart @@ -9,12 +9,12 @@ class ListDetailScreen extends StatefulWidget { final String filepath; const ListDetailScreen({ - Key? key, + super.key, required this.title, required this.imagePath, required this.paragraphs, required this.filepath, - }) : super(key: key); + }); @override _ListDetailScreenState createState() => _ListDetailScreenState(); @@ -41,6 +41,11 @@ class _ListDetailScreenState extends State { String html = await DefaultAssetBundle.of( context, ).loadString(widget.filepath); + + html = html.replaceAllMapped( + RegExp(r'

(.*?)
', dotAll: true), + (match) => '${match.group(1)}', + ); setState(() { _htmlContent = html; }); @@ -102,115 +107,73 @@ class _ListDetailScreenState extends State { child: SingleChildScrollView( padding: const EdgeInsets.only(left: 18.0, right: 18, bottom: 18), child: - // ListView.builder( - // itemCount: widget.paragraphs.length, - // itemBuilder: (context, index) { - // return - // Padding( - // padding: const EdgeInsets.only(bottom: 16.0), - // child: Row( - // crossAxisAlignment: CrossAxisAlignment.start, - // children: [ - // Expanded( - // child: - // // Text( - // // widget.paragraphs[index] + - // // style: TextStyle(color: Colors.black), - // Html( - // // style: { - // // "body": Style( - // // color: const Color.fromRGBO(0, 0, 0, 1), - // // ), - // // }, - // data: - // widget.paragraphs + - // """ - // - // - // - // Enter a title, displayed at the top of the window. - // - // - // - //

Enter the main heading, usually the same as the title.

- //

Be bold in stating your key points. Put them in a list:

- //
    - //
  • The first item in your list
    • - //
  • The second item; italicize key words
    • - //
- //

Improve your image by including an image.

- //

A Great HTML Resource

- //

Add a link to your favorite Web site. - // Break up your page with a horizontal rule or two.

- //
- //

Finally, link to another page in your own Web site.

- // - //

© Wiley Publishing, 2011

- // - // - // """, - // ), - // ), - // // ), - // // Checkbox( - // // value: _readStatus[index], - // // onChanged: (bool? value) { - // // _toggleReadStatus(index); - // // }, - // // ), - // ], - // ), - // ); - // }, - // ), - Html( - style: {"body": Style(color: const Color.fromRGBO(0, 0, 0, 1))}, - // data: widget.paragraphs, - data: _htmlContent, - extensions: [ - TagExtension( - tagsToExtend: {"img"}, - builder: (ExtensionContext context) { - final attrs = context.attributes; - final src = attrs['src'] ?? ''; - - if (src.isNotEmpty) { - if (src.startsWith('assets/html/')) { - return Image.asset( - src, - width: 100, - errorBuilder: - (context, error, stackTrace) => - const Text('Image not found'), - ); - } else if (!src.startsWith('http')) { - return Image.asset( - 'assets/images/$src', - width: 100, - errorBuilder: - (context, error, stackTrace) => - const Text('Image not found'), - ); - } else { - return Image.network( - src, - width: 100, - errorBuilder: - (context, error, stackTrace) => - const Text('Image failed to load'), - ); - } - } - return const SizedBox(); - }, - ), - ], - ), + // ListView.builder( + // itemCount: widget.paragraphs.length, + // itemBuilder: (context, index) { + // return + // Padding( + // padding: const EdgeInsets.only(bottom: 16.0), + // child: Row( + // crossAxisAlignment: CrossAxisAlignment.start, + // children: [ + // Expanded( + // child: + // // Text( + // // widget.paragraphs[index] + + // // style: TextStyle(color: Colors.black), + // Html( + // // style: { + // // "body": Style( + // // color: const Color.fromRGBO(0, 0, 0, 1), + // // ), + // // }, + // data: + // widget.paragraphs + + // """ + // + // + // + // Enter a title, displayed at the top of the window. + // + // + // + //

Enter the main heading, usually the same as the title.

+ //

Be bold in stating your key points. Put them in a list:

+ //
    + //
  • The first item in your list
    • + //
  • The second item; italicize key words
    • + //
+ //

Improve your image by including an image.

+ //

A Great HTML Resource

+ //

Add a link to your favorite Web site. + // Break up your page with a horizontal rule or two.

+ //
+ //

Finally, link to another page in your own Web site.

+ // + //

© Wiley Publishing, 2011

+ // + // + // """, + // ), + // ), + // // ), + // // Checkbox( + // // value: _readStatus[index], + // // onChanged: (bool? value) { + // // _toggleReadStatus(index); + // // }, + // // ), + // ], + // ), + // ); + // }, + // ), + htmlBody(), ), ), ], @@ -218,4 +181,71 @@ class _ListDetailScreenState extends State { // ), ); } + + Html htmlBody() { + return Html( + style: {"body": Style(color: const Color.fromRGBO(0, 0, 0, 1))}, + // data: widget.paragraphs, + data: _htmlContent, + extensions: [ + TagExtension( + tagsToExtend: {"img"}, + builder: (ExtensionContext context) { + final attrs = context.attributes; + final src = attrs['src'] ?? ''; + + if (src.isNotEmpty) { + if (src.startsWith('assets/html/')) { + return Image.asset( + src, + width: 100, + errorBuilder: + (context, error, stackTrace) => + const Text('Image not found'), + ); + } else if (!src.startsWith('http')) { + return Image.asset( + 'assets/images/$src', + width: 100, + errorBuilder: + (context, error, stackTrace) => + const Text('Image not found'), + ); + } else { + return Image.network( + src, + width: 100, + errorBuilder: + (context, error, stackTrace) => + const Text('Image failed to load'), + ); + } + } + return const SizedBox(); + }, + ), + TagExtension( + tagsToExtend: {"gizi-grid"}, + builder: (context) { + final spans = context.inlineSpanChildren ?? []; + + final widgets = + spans.map((span) { + if (span is WidgetSpan) return span.child; + return const SizedBox(); + }).toList(); + + return Wrap( + spacing: 12, + runSpacing: 12, + children: + widgets.map((child) { + return SizedBox(width: 160, child: child); + }).toList(), + ); + }, + ), + ], + ); + } } diff --git a/lib/screen/pustaka_screen copy 2.dart b/lib/screen/pustaka_screen copy 2.dart index 0af1108..a41f270 100644 --- a/lib/screen/pustaka_screen copy 2.dart +++ b/lib/screen/pustaka_screen copy 2.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/collection_container.dart'; -import 'package:furibase/components/menu_button.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/screen/Home_screen.dart'; -import 'package:furibase/screen/pustaka/list_education.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/collection_container.dart'; +import 'package:freekake/components/menu_button.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/screen/Home_screen.dart'; +import 'package:freekake/screen/pustaka/list_education.dart'; class PustakaScreen extends StatefulWidget { const PustakaScreen({super.key}); diff --git a/lib/screen/pustaka_screen copy 3.dart b/lib/screen/pustaka_screen copy 3.dart index aae9019..7b20c6f 100644 --- a/lib/screen/pustaka_screen copy 3.dart +++ b/lib/screen/pustaka_screen copy 3.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/collection_container.dart'; -import 'package:furibase/components/menu_button.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/screen/Home_screen.dart'; -import 'package:furibase/screen/pustaka/list_education.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/collection_container.dart'; +import 'package:freekake/components/menu_button.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/screen/Home_screen.dart'; +import 'package:freekake/screen/pustaka/list_education.dart'; class PustakaScreen extends StatefulWidget { const PustakaScreen({super.key}); diff --git a/lib/screen/pustaka_screen copy.dart b/lib/screen/pustaka_screen copy.dart index 0af1108..a41f270 100644 --- a/lib/screen/pustaka_screen copy.dart +++ b/lib/screen/pustaka_screen copy.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/collection_container.dart'; -import 'package:furibase/components/menu_button.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/screen/Home_screen.dart'; -import 'package:furibase/screen/pustaka/list_education.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/collection_container.dart'; +import 'package:freekake/components/menu_button.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/screen/Home_screen.dart'; +import 'package:freekake/screen/pustaka/list_education.dart'; class PustakaScreen extends StatefulWidget { const PustakaScreen({super.key}); diff --git a/lib/screen/pustaka_screen.dart b/lib/screen/pustaka_screen.dart index 210d068..b33d1b5 100644 --- a/lib/screen/pustaka_screen.dart +++ b/lib/screen/pustaka_screen.dart @@ -1,12 +1,12 @@ import 'package:flutter/material.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/buildcard_info.dart'; -import 'package:furibase/components/collection_container.dart'; -import 'package:furibase/components/main_menu.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/components/topbar_container.dart'; -import 'package:furibase/helpers/color_helper.dart'; -import 'package:furibase/screen/pustaka/list_education.dart'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/buildcard_info.dart'; +import 'package:freekake/components/collection_container.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/components/topbar_container.dart'; +import 'package:freekake/helpers/color_helper.dart'; +import 'package:freekake/screen/pustaka/list_education.dart'; class PustakaScreen extends StatefulWidget { const PustakaScreen({super.key}); @@ -71,202 +71,209 @@ class _PustakaScreenState extends State { return Scaffold( backgroundColor: const Color.fromARGB(255, 255, 255, 255), - body: Stack( - children: [ - //Top Bar - Positioned( - top: 0, - left: 0, - right: 0, - child: SizedBox(height: 130, child: TopbarContainer()), - ), - Column( - children: [ - // Header Section - Container( - padding: const EdgeInsets.all(10), - color: const Color.fromARGB( - 250, - 255, - 255, - 255, - ).withOpacity(0.0), + body: pustakaBody( + filteredCollections, + context, + bottomPadding, + screenWidth, + buttonScanSize, + ), + ); + } + + Stack pustakaBody( + List> filteredCollections, + BuildContext context, + double bottomPadding, + double screenWidth, + double buttonScanSize, + ) { + return Stack( + children: [ + //Top Bar + Positioned( + top: 0, + left: 0, + right: 0, + child: SizedBox(height: 130, child: TopbarContainer()), + ), + Column( + children: [ + // Header Section + Container( + padding: const EdgeInsets.all(10), + color: const Color.fromARGB(250, 255, 255, 255).withOpacity(0.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + BuildcardInfo( + icon: Icons.person, + text: 'User01', + extraIcon: Icons.emoji_events, + extraText: "5000", + width: 180, + ), + BuildcardInfo( + icon: Icons.monetization_on, + text: "1.300", + width: 90, + ), + ], + ), + ), + + // // Date Display + // Padding( + // padding: const EdgeInsets.symmetric(vertical: 10), + // child: Text( + // DateTime.now().toString(), + // style: const TextStyle(color: Colors.white), + // ), + // ), + + // Search Bar + Padding( + padding: const EdgeInsets.symmetric(horizontal: 40, vertical: 10), + child: Container( + height: 47, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(20), + color: const Color.fromARGB(255, 237, 227, 227), + ), + padding: const EdgeInsets.symmetric(horizontal: 15), child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - BuildcardInfo( - icon: Icons.person, - text: 'User01', - extraIcon: Icons.emoji_events, - extraText: "5000", - width: 180, - ), - BuildcardInfo( - icon: Icons.monetization_on, - text: "1.300", - width: 90, + const Icon(Icons.search, color: Colors.black54, size: 18), + const SizedBox(width: 8), + Expanded( + child: TextField( + controller: _searchController, + onChanged: (value) { + setState(() { + _searchQuery = value; + }); + }, + style: const TextStyle( + color: Colors.black, + fontSize: 12, + ), + decoration: const InputDecoration( + border: InputBorder.none, + hintText: 'Search...', + hintStyle: TextStyle(color: Colors.grey), + ), + ), ), ], ), ), - - // // Date Display - // Padding( - // padding: const EdgeInsets.symmetric(vertical: 10), - // child: Text( - // DateTime.now().toString(), - // style: const TextStyle(color: Colors.white), - // ), - // ), - - // Search Bar - Padding( + ), + // Collection Items + SizedBox( + height: 440, + child: Padding( padding: const EdgeInsets.symmetric( - horizontal: 40, - vertical: 10, + horizontal: 58, + vertical: 60, ), - child: Container( - height: 47, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(20), - color: const Color.fromARGB(255, 237, 227, 227), + child: GridView.builder( + gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent( + maxCrossAxisExtent: 140, + mainAxisSpacing: 20, + crossAxisSpacing: 20, + childAspectRatio: 1, // 1:1 rasio (kotak) ), - padding: const EdgeInsets.symmetric(horizontal: 15), + itemCount: filteredCollections.length, + itemBuilder: (context, index) { + final item = filteredCollections[index]; + return CollectionContainer( + label: item["label"]!, + imageSvg: item["image"]!, + width: 30, + height: 80, + textColor: Colors.black, + circle: true, + colorContiner: ColorHelper.hexToColor(item["color"]), + onTapAc: () { + Navigator.push( + context, + MaterialPageRoute( + builder: (_) => const ListEducation(), + ), + ); + }, + ); + }, + ), + ), + ), + // SizedBox( + // child: Padding( + // padding: const EdgeInsets.symmetric( + // horizontal: 5, + // vertical: 1, + // ), + // child: Column( + // crossAxisAlignment: CrossAxisAlignment.start, + // children: [ + // Text("List Topic", style: TextStyle(color: Colors.black)), + // Divider(color: Colors.transparent), + // ], + // ), + // ), + // ), + // Horizontal Scroll List + Padding( + padding: EdgeInsets.symmetric(horizontal: 5, vertical: 5), + child: SizedBox( + width: MediaQuery.of(context).size.width, + height: 100, + child: SingleChildScrollView( + scrollDirection: Axis.horizontal, child: Row( - children: [ - const Icon(Icons.search, color: Colors.black54, size: 18), - const SizedBox(width: 8), - Expanded( - child: TextField( - controller: _searchController, - onChanged: (value) { - setState(() { - _searchQuery = value; - }); - }, - style: const TextStyle( - color: Colors.black, - fontSize: 12, + children: List.generate( + 10, + (index) => Padding( + padding: const EdgeInsets.symmetric(horizontal: 8.0), + child: Card( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10.0), ), - decoration: const InputDecoration( - border: InputBorder.none, - hintText: 'Search...', - hintStyle: TextStyle(color: Colors.grey), - ), - ), - ), - ], - ), - ), - ), - // Collection Items - Container( - height: 440, - child: Padding( - padding: const EdgeInsets.symmetric( - horizontal: 58, - vertical: 60, - ), - child: GridView.builder( - gridDelegate: - const SliverGridDelegateWithMaxCrossAxisExtent( - maxCrossAxisExtent: 140, - mainAxisSpacing: 20, - crossAxisSpacing: 20, - childAspectRatio: 1, // 1:1 rasio (kotak) - ), - itemCount: filteredCollections.length, - itemBuilder: (context, index) { - final item = filteredCollections[index]; - return CollectionContainer( - label: item["label"]!, - imageSvg: item["image"]!, - width: 30, - height: 80, - textColor: Colors.black, - circle: true, - colorContiner: ColorHelper.hexToColor(item["color"]), - onTapAc: () { - Navigator.push( - context, - MaterialPageRoute( - builder: (_) => const ListEducation(), - ), - ); - }, - ); - }, - ), - ), - ), - // SizedBox( - // child: Padding( - // padding: const EdgeInsets.symmetric( - // horizontal: 5, - // vertical: 1, - // ), - // child: Column( - // crossAxisAlignment: CrossAxisAlignment.start, - // children: [ - // Text("List Topic", style: TextStyle(color: Colors.black)), - // Divider(color: Colors.transparent), - // ], - // ), - // ), - // ), - // Horizontal Scroll List - Padding( - padding: EdgeInsets.symmetric(horizontal: 5, vertical: 5), - child: SizedBox( - width: MediaQuery.of(context).size.width, - height: 100, - child: SingleChildScrollView( - scrollDirection: Axis.horizontal, - child: Row( - children: List.generate( - 10, - (index) => Padding( - padding: const EdgeInsets.symmetric(horizontal: 8.0), - child: Card( - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(10.0), - ), - elevation: 5, - color: ColorHelper.hexToColor("#efd8c6"), - // color: const Color.fromARGB(140, 255, 255, 255), - // shape: RoundedRectangleBorder( - // borderRadius: BorderRadius.circular(15), - // ), - child: GestureDetector( - onTap: - () => { - Navigator.push( - context, - MaterialPageRoute( - builder: (context) => ListEducation(), - ), + elevation: 5, + color: ColorHelper.hexToColor("#efd8c6"), + // color: const Color.fromARGB(140, 255, 255, 255), + // shape: RoundedRectangleBorder( + // borderRadius: BorderRadius.circular(15), + // ), + child: GestureDetector( + onTap: + () => { + Navigator.push( + context, + MaterialPageRoute( + builder: (context) => ListEducation(), ), - }, - child: Container( - width: 80, - padding: const EdgeInsets.all(10), - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Icon( - Icons.book, - size: 50, - color: Colors.blueAccent, + ), + }, + child: Container( + width: 80, + padding: const EdgeInsets.all(10), + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Icon( + Icons.book, + size: 50, + color: Colors.blueAccent, + ), + Text( + 'Topic ${index + 1}', + style: const TextStyle( + fontWeight: FontWeight.bold, + color: Color.fromARGB(255, 0, 0, 0), ), - Text( - 'Topic ' + (index + 1).toString(), - style: const TextStyle( - fontWeight: FontWeight.bold, - color: Color.fromARGB(255, 0, 0, 0), - ), - ), - ], - ), + ), + ], ), ), ), @@ -276,32 +283,32 @@ class _PustakaScreenState extends State { ), ), ), - // Bottom Navigation - // MainMenu(), - ], - ), - // 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: bottomPadding * 98, - left: (screenWidth - buttonScanSize) / 2, - child: Transform.translate( - offset: Offset(0, -20), - child: ScanButton(), ), + // Bottom Navigation + // MainMenu(), + ], + ), + // 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: bottomPadding * 98, + left: (screenWidth - buttonScanSize) / 2, + child: Transform.translate( + offset: Offset(0, -20), + child: ScanButton(), ), - ], - ), + ), + ], ); } } diff --git a/lib/screen/saya/akun_saya.dart b/lib/screen/saya/akun_saya.dart index 40157da..18b37ff 100644 --- a/lib/screen/saya/akun_saya.dart +++ b/lib/screen/saya/akun_saya.dart @@ -1,9 +1,9 @@ import 'dart:typed_data'; import 'package:flutter/material.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/main_menu.dart'; -import 'package:furibase/components/scan_button.dart'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; import 'package:image_picker/image_picker.dart'; import 'dart:io'; @@ -11,6 +11,8 @@ import 'dart:io'; import 'package:flutter/foundation.dart' show kIsWeb; class AkunSaya extends StatefulWidget { + const AkunSaya({super.key}); + @override _AkunSayaState createState() => _AkunSayaState(); } diff --git a/lib/screen/saya/profile_screen copy.dart b/lib/screen/saya/profile_screen copy.dart index 0e9f852..4fa0d8a 100644 --- a/lib/screen/saya/profile_screen copy.dart +++ b/lib/screen/saya/profile_screen copy.dart @@ -2,10 +2,10 @@ import 'dart:typed_data'; import 'package:flutter/material.dart'; import 'package:flutter_html/flutter_html.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/main_menu.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/screen/saya/akun_saya.dart'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/screen/saya/akun_saya.dart'; import 'package:image_picker/image_picker.dart'; import 'dart:io'; @@ -13,6 +13,8 @@ import 'package:image_picker_web/image_picker_web.dart'; import 'package:flutter/foundation.dart' show kIsWeb; class ProfileScreenCopy extends StatefulWidget { + const ProfileScreenCopy({super.key}); + @override _ProfileScreenState createState() => _ProfileScreenState(); } diff --git a/lib/screen/saya/profile_screen.dart b/lib/screen/saya/profile_screen.dart index 76440f0..302bb82 100644 --- a/lib/screen/saya/profile_screen.dart +++ b/lib/screen/saya/profile_screen.dart @@ -2,11 +2,11 @@ import 'dart:typed_data'; import 'package:flutter/material.dart'; // import 'package:flutter_html/flutter_html.dart'; -import 'package:furibase/components/bottom_navbar.dart'; -import 'package:furibase/components/main_menu.dart'; -import 'package:furibase/components/scan_button.dart'; -import 'package:furibase/components/topbar_container.dart'; -import 'package:furibase/screen/saya/akun_saya.dart'; +import 'package:freekake/components/bottom_navbar.dart'; +import 'package:freekake/components/main_menu.dart'; +import 'package:freekake/components/scan_button.dart'; +import 'package:freekake/components/topbar_container.dart'; +import 'package:freekake/screen/saya/akun_saya.dart'; import 'package:image_picker/image_picker.dart'; import 'dart:io'; @@ -14,6 +14,8 @@ import 'dart:io'; import 'package:flutter/foundation.dart' show kIsWeb; class ProfileScreen extends StatefulWidget { + const ProfileScreen({super.key}); + @override _ProfileScreenState createState() => _ProfileScreenState(); } diff --git a/pubspec.yaml b/pubspec.yaml index 384d8a8..baaa806 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,4 +1,4 @@ -name: furibase +name: freekake description: "A new Flutter project." # The following line prevents the package from being accidentally published to # pub.dev using `flutter pub publish`. This is preferred for private packages. diff --git a/test/widget_test.dart b/test/widget_test.dart index 3422b2a..6b738eb 100644 --- a/test/widget_test.dart +++ b/test/widget_test.dart @@ -8,7 +8,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_test/flutter_test.dart'; -import 'package:furibase/main.dart'; +import 'package:freekake/main.dart'; void main() { testWidgets('Counter increments smoke test', (WidgetTester tester) async {