diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..d346aed --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,28 @@ +{ + // IntelliSense を使用して利用可能な属性を学べます。 + // 既存の属性の説明をホバーして表示します。 + // 詳細情報は次を確認してください: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "name": "qiita_app", + "cwd": "qiita_app", + "request": "launch", + "type": "dart" + }, + { + "name": "qiita_app (profile mode)", + "cwd": "qiita_app", + "request": "launch", + "type": "dart", + "flutterMode": "profile" + }, + { + "name": "qiita_app (release mode)", + "cwd": "qiita_app", + "request": "launch", + "type": "dart", + "flutterMode": "release" + } + ] +} \ No newline at end of file diff --git a/qiita_app/lib/pages/setting_page.dart b/qiita_app/lib/pages/setting_page.dart index 90fe2b4..737688e 100644 --- a/qiita_app/lib/pages/setting_page.dart +++ b/qiita_app/lib/pages/setting_page.dart @@ -1,60 +1,154 @@ import 'package:flutter/material.dart'; +import 'package:package_info_plus/package_info_plus.dart'; +import 'package:qiita_app/constants/app_colors.dart'; +import 'package:qiita_app/widgets/app_title.dart'; +import 'package:qiita_app/widgets/setting_section_title.dart'; +import '../widgets/setting_item.dart'; import 'package:qiita_app/constants/app_text_style.dart'; import 'package:qiita_app/constants/texts.dart'; import 'package:qiita_app/widgets/app_bottom_modal_sheet.dart'; -import 'package:qiita_app/widgets/rounded_edge_button.dart'; -import 'package:qiita_app/constants/app_colors.dart'; - -class SettingPage extends StatefulWidget { - const SettingPage({Key? key}) : super(key: key); +class SettingsPage extends StatefulWidget { + const SettingsPage({Key? key}) : super(key: key); @override - State createState() => _SettingPageState(); + State createState() => _SettingsPageState(); } -class _SettingPageState extends State { +class _SettingsPageState extends State { + String version = 'v0.0.0'; + Future setVersion() async { + PackageInfo packageInfo = await PackageInfo.fromPlatform(); + setState(() { + version = 'v${packageInfo.version}'; + }); + } + + @override + void initState() { + super.initState(); + setVersion(); + } + + Widget buildCustomDivider({ + Color color = AppColors.divider, + double height = 0.5, + double indent = 16.0, + }) { + return Divider( + color: color, + height: height, + indent: indent, + ); + } + @override Widget build(BuildContext context) { return Scaffold( - body: Center( - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - RoundedEdgeButton( - text: "プライバシーポリシー", - backgroundColor: AppColors.primary, - onPressed: () { - showAppBottomModalSheet( - context, - title: "プライバシーポリシー", - content: const Text( - Texts.privacyPolicyText, - style: AppTextStyles.h3BasicBlack, - ), - ); - }, - ), - const SizedBox( - height: 42, - ), - RoundedEdgeButton( - text: "利用規約", - backgroundColor: AppColors.primary, - onPressed: () { - showAppBottomModalSheet( - context, - title: "利用規約", - content: const Text( - Texts.termsService, - style: AppTextStyles.h3BasicBlack, - ), - ); - }, + appBar: const AppTitle( + title: "Settings", + showSearchBar: false, + showBottomDivider: true, + // dividerHeight: 4.2, + ), + body: ListView( + children: [ + const SectionTitle(title: 'アプリ情報'), + SettingItem( + title: 'プライバシーポリシー', + onTap: () { + showAppBottomModalSheet( + context, + title: "プライバシーポリシー", + content: const Text( + Texts.privacyPolicyText, + style: AppTextStyles.h2BasicBlack, + ), + ); + }, + ), + buildCustomDivider(), + SettingItem( + title: '利用規約', + onTap: () { + showAppBottomModalSheet( + context, + title: "利用規約", + content: const Text( + Texts.termsService, + style: AppTextStyles.h3BasicBlack, + ), + ); + }, + ), + buildCustomDivider(), + ListTile( + tileColor: Colors.white, + title: Row( + children: [ + const Text('アプリバージョン'), + const Spacer(), + Text(version), + ], ), - ], - ), + ), + buildCustomDivider(), + const SectionTitle(title: 'その他'), + SettingItem( + title: 'ログアウトする', + onTap: () { + // ログアウト処理をあとで追加 + }, + showArrow: false, + ), + buildCustomDivider(), + ], ), ); } } +// class _SettingPageState extends State { +// @override +// Widget build(BuildContext context) { +// return Scaffold( +// body: Center( +// child: Column( +// mainAxisAlignment: MainAxisAlignment.center, +// children: [ +// RoundedEdgeButton( +// text: "プライバシーポリシー", +// backgroundColor: AppColors.primary, +// onPressed: () { +// showAppBottomModalSheet( +// context, +// title: "プライバシーポリシー", +// content: const Text( +// Texts.privacyPolicyText, +// style: AppTextStyles.h2BasicBlack, +// ), +// ); +// }, +// ), +// const SizedBox( +// height: 42, +// ), +// RoundedEdgeButton( +// text: "利用規約", +// backgroundColor: AppColors.primary, +// onPressed: () { +// showAppBottomModalSheet( +// context, +// title: "利用規約", +// content: const Text( +// Texts.termsService, +// style: AppTextStyles.h3BasicBlack, +// ), +// ); +// }, +// ), +// ], +// ), +// ), +// ); +// } +// } diff --git a/qiita_app/lib/widgets/app_title.dart b/qiita_app/lib/widgets/app_title.dart index 3805f96..c684308 100644 --- a/qiita_app/lib/widgets/app_title.dart +++ b/qiita_app/lib/widgets/app_title.dart @@ -45,7 +45,7 @@ class AppTitle extends StatelessWidget implements PreferredSizeWidget { title, style: style ?? AppTextStyles.apptitle, ), - const SizedBox(height: 19), + const SizedBox(height: 10), if (showSearchBar) const SearchBarWithIcon(), if (showBottomDivider) SizedBox(height: dividerHeight), ], diff --git a/qiita_app/lib/widgets/bottom_navigation.dart b/qiita_app/lib/widgets/bottom_navigation.dart index 6444439..acc2a1e 100644 --- a/qiita_app/lib/widgets/bottom_navigation.dart +++ b/qiita_app/lib/widgets/bottom_navigation.dart @@ -21,7 +21,7 @@ class _BottomNavigationState extends State { Text( 'Index 2: mypage', ), - SettingPage(), + SettingsPage(), ]; void _onItemTapped(int index) { diff --git a/qiita_app/lib/widgets/setting_item.dart b/qiita_app/lib/widgets/setting_item.dart new file mode 100644 index 0000000..8e4c822 --- /dev/null +++ b/qiita_app/lib/widgets/setting_item.dart @@ -0,0 +1,25 @@ +import 'package:flutter/material.dart'; +import 'package:qiita_app/constants/app_colors.dart'; + +class SettingItem extends StatelessWidget { + final String title; + final VoidCallback onTap; + final bool showArrow; + + const SettingItem({ + Key? key, + required this.title, + required this.onTap, + this.showArrow = true, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + return ListTile( + tileColor: AppColors.white, + title: Text(title), + trailing: showArrow ? const Icon(Icons.arrow_forward_ios) : null, + onTap: onTap, + ); + } +} diff --git a/qiita_app/lib/widgets/setting_section_title.dart b/qiita_app/lib/widgets/setting_section_title.dart new file mode 100644 index 0000000..371cc3d --- /dev/null +++ b/qiita_app/lib/widgets/setting_section_title.dart @@ -0,0 +1,23 @@ +import 'package:flutter/material.dart'; + +import '../constants/app_colors.dart'; + +class SectionTitle extends StatelessWidget { + final String title; + + const SectionTitle({ + Key? key, + required this.title, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + return Padding( + padding: const EdgeInsets.fromLTRB(16.0, 32.0, 16.0, 8.0), + child: Text( + title, + style: const TextStyle(fontSize: 12, color: AppColors.secondary), + ), + ); + } +} diff --git a/qiita_app/pubspec.yaml b/qiita_app/pubspec.yaml index af863e4..57252d8 100644 --- a/qiita_app/pubspec.yaml +++ b/qiita_app/pubspec.yaml @@ -12,6 +12,8 @@ dependencies: flutter: sdk: flutter http: ^0.13.3 + package_info_plus: ^4.2.0 + cupertino_icons: ^1.0.6