From ef952951a5ba9ea709dea42b7e2c6854f959c0d8 Mon Sep 17 00:00:00 2001 From: MOKTADIR Date: Mon, 20 Mar 2023 02:10:50 +0600 Subject: [PATCH] post detail --- .../home/controllers/home_controller.dart | 25 +++++++++++-- lib/app/modules/home/views/home_view.dart | 32 +++++++++------- .../modules/home/views/post_detail_view.dart | 37 +++++++++++++++++++ lib/app/service/api_urls.dart | 1 + lib/config/theme/light_theme_colors.dart | 4 +- lib/config/theme/my_styles.dart | 25 ++++++------- 6 files changed, 92 insertions(+), 32 deletions(-) create mode 100644 lib/app/modules/home/views/post_detail_view.dart diff --git a/lib/app/modules/home/controllers/home_controller.dart b/lib/app/modules/home/controllers/home_controller.dart index 2df2180..b7bf53e 100644 --- a/lib/app/modules/home/controllers/home_controller.dart +++ b/lib/app/modules/home/controllers/home_controller.dart @@ -1,4 +1,6 @@ import 'package:get/get.dart'; +import 'package:getx_standard/app/modules/home/bindings/home_binding.dart'; +import 'package:getx_standard/app/modules/home/views/post_detail_view.dart'; import '../../../service/api_urls.dart'; import '../../../service/base_controller.dart'; @@ -12,10 +14,8 @@ class HomeController extends GetxController with BaseController { getPostList() async { showLoading(); - var response = await DioClient().get(url: ApiUrl.allPosts, header: { - 'Accept': 'application/json', - 'Content-Type': 'application/json', - }).catchError(handleError); + var response = await DioClient() + .get(url: ApiUrl.allPosts, header: {}).catchError(handleError); if (response == null) return; @@ -25,6 +25,23 @@ class HomeController extends GetxController with BaseController { hideLoading(); } + /// GET POST DETAIL + String title = ""; + String body = ""; + + getPostDetail(int? id) async { + showLoading(); + var response = await DioClient().get( + url: "${ApiUrl.postDetail}$id", header: {}).catchError(handleError); + + if (response == null) return; + + title = response["title"].toString(); + body = response["body"].toString(); + hideLoading(); + Get.to(() => const PostDetailView(), binding: HomeBinding()); + } + @override void onReady() async { // TODO: implement onReady diff --git a/lib/app/modules/home/views/home_view.dart b/lib/app/modules/home/views/home_view.dart index 90e72d8..1dbfd85 100644 --- a/lib/app/modules/home/views/home_view.dart +++ b/lib/app/modules/home/views/home_view.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; - import 'package:get/get.dart'; + import '../../../../config/theme/my_fonts.dart'; import '../../../components/empty_widget.dart'; import '../controllers/home_controller.dart'; @@ -36,18 +36,24 @@ class HomeView extends GetView { separatorBuilder: (_, __) => SizedBox( height: 20.h, ), - itemBuilder: (ctx, index) => Container( - padding: const EdgeInsets.all(5), - width: double.infinity, - color: theme.canvasColor, - child: Center( - child: Text( - controller.postList[index].title ?? "", - textAlign: TextAlign.center, - style: TextStyle( - fontSize: MyFonts.headline6TextSize, - fontWeight: FontWeight.w500, - color: theme.primaryColor, + itemBuilder: (ctx, index) => GestureDetector( + onTap: () async { + await controller + .getPostDetail(controller.postList[index].id); + }, + child: Container( + padding: const EdgeInsets.all(5), + width: double.infinity, + color: theme.canvasColor, + child: Center( + child: Text( + controller.postList[index].title ?? "", + textAlign: TextAlign.center, + style: TextStyle( + fontSize: MyFonts.headline6TextSize, + fontWeight: FontWeight.w500, + color: theme.primaryColor, + ), ), ), ), diff --git a/lib/app/modules/home/views/post_detail_view.dart b/lib/app/modules/home/views/post_detail_view.dart new file mode 100644 index 0000000..171e2f9 --- /dev/null +++ b/lib/app/modules/home/views/post_detail_view.dart @@ -0,0 +1,37 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; +import 'package:get/get.dart'; + +import '../controllers/home_controller.dart'; + +class PostDetailView extends GetView { + const PostDetailView({Key? key}) : super(key: key); + @override + Widget build(BuildContext context) { + var theme = Theme.of(context); + return Scaffold( + appBar: AppBar( + title: const Text('Post Detail'), + centerTitle: true, + ), + body: Padding( + padding: const EdgeInsets.all(18.0), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Text( + controller.title, + style: theme.textTheme.headlineSmall, + ), + SizedBox(height: 40.h), + Text( + controller.body, + style: theme.textTheme.bodyLarge, + ), + ], + ), + ), + ); + } +} diff --git a/lib/app/service/api_urls.dart b/lib/app/service/api_urls.dart index facf4c0..0da99a6 100644 --- a/lib/app/service/api_urls.dart +++ b/lib/app/service/api_urls.dart @@ -2,4 +2,5 @@ class ApiUrl { /// Base URL static const baseUrl = "https://jsonplaceholder.typicode.com"; static const allPosts = "$baseUrl/posts"; + static const postDetail = "$baseUrl/posts/"; } diff --git a/lib/config/theme/light_theme_colors.dart b/lib/config/theme/light_theme_colors.dart index d20cd18..07ae328 100644 --- a/lib/config/theme/light_theme_colors.dart +++ b/lib/config/theme/light_theme_colors.dart @@ -26,8 +26,8 @@ class LightThemeColors { static const Color buttonDisabledTextColor = Colors.black; //TEXT - static const Color bodyTextColor = Colors.black; - static const Color headlinesTextColor = Colors.black; + static const Color bodyTextColor = primaryColor; + static const Color headlinesTextColor = primaryColor; static const Color captionTextColor = Colors.grey; static const Color hintTextColor = Color(0xff686868); diff --git a/lib/config/theme/my_styles.dart b/lib/config/theme/my_styles.dart index 127eacd..b63cf02 100644 --- a/lib/config/theme/my_styles.dart +++ b/lib/config/theme/my_styles.dart @@ -1,10 +1,9 @@ import 'package:flutter/material.dart'; - import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'dark_theme_colors.dart'; -import 'my_fonts.dart'; import 'light_theme_colors.dart'; +import 'my_fonts.dart'; class MyStyles { ///icons theme @@ -20,7 +19,7 @@ class MyStyles { AppBarTheme( elevation: 0, titleTextStyle: - getTextTheme(isLightTheme: isLightTheme).bodyText1!.copyWith( + getTextTheme(isLightTheme: isLightTheme).bodyLarge!.copyWith( color: Colors.white, fontSize: MyFonts.appBarTittleSize, ), @@ -35,56 +34,56 @@ class MyStyles { ///text theme static TextTheme getTextTheme({required bool isLightTheme}) => TextTheme( - button: + labelLarge: MyFonts.buttonTextStyle.copyWith(fontSize: MyFonts.buttonTextSize), - bodyText1: (MyFonts.bodyTextStyle).copyWith( + bodyLarge: (MyFonts.bodyTextStyle).copyWith( fontWeight: FontWeight.bold, fontSize: MyFonts.body1TextSize, color: isLightTheme ? LightThemeColors.bodyTextColor : DarkThemeColors.bodyTextColor), - bodyText2: (MyFonts.bodyTextStyle).copyWith( + bodyMedium: (MyFonts.bodyTextStyle).copyWith( fontSize: MyFonts.body2TextSize, color: isLightTheme ? LightThemeColors.bodyTextColor : DarkThemeColors.bodyTextColor), - headline1: (MyFonts.headlineTextStyle).copyWith( + displayLarge: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline1TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - headline2: (MyFonts.headlineTextStyle).copyWith( + displayMedium: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline2TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - headline3: (MyFonts.headlineTextStyle).copyWith( + displaySmall: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline3TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - headline4: (MyFonts.headlineTextStyle).copyWith( + headlineMedium: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline4TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - headline5: (MyFonts.headlineTextStyle).copyWith( + headlineSmall: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline5TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - headline6: (MyFonts.headlineTextStyle).copyWith( + titleLarge: (MyFonts.headlineTextStyle).copyWith( fontSize: MyFonts.headline6TextSize, fontWeight: FontWeight.bold, color: isLightTheme ? LightThemeColors.headlinesTextColor : DarkThemeColors.headlinesTextColor), - caption: TextStyle( + bodySmall: TextStyle( color: isLightTheme ? LightThemeColors.captionTextColor : DarkThemeColors.captionTextColor,