Comunic/comunicmobile
1
0
Fork 0
mirror of https://gitlab.com/comunic/comunicmobile synced 2024-11-22 12:59:21 +00:00
Code Issues Projects Releases Wiki Activity

Make settings route responsive

Browse Source
This commit is contained in:
Pierre HUBERT 2020-05-13 18:12:45 +02:00
parent dfcc49eab4
commit 4c11aa9753
7 changed files with 163 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
lib/ui/routes/settings/account_image_settings.dart
View File

@ -16,25 +16,14 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre Hubert
class AccountImageSettingsScreen extends StatelessWidget {
class AccountImageSettingsScreen extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(tr("Account image settings")),
),
body: _AccountImageSettingsBody(),
);
}
_AccountImageSettingsScreenState createState() =>
_AccountImageSettingsScreenState();
}
class _AccountImageSettingsBody extends StatefulWidget {
@override
__AccountImageSettingsBodyState createState() =>
__AccountImageSettingsBodyState();
}
class __AccountImageSettingsBodyState extends State<_AccountImageSettingsBody> {
class _AccountImageSettingsScreenState
extends State<AccountImageSettingsScreen> {
AccountImageSettings _settings;
final _key = GlobalKey<AsyncScreenWidgetState>();

16
lib/ui/routes/settings/account_privacy_settings.dart
View File

@ -10,22 +10,12 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre HUBERT
class AccountPrivacySettings extends StatelessWidget {
class AccountPrivacySettings extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(tr("Privacy settings"))),
body: _AccountPrivacyScreen(),
);
}
_AccountPrivacySettingsState createState() => _AccountPrivacySettingsState();
}
class _AccountPrivacyScreen extends StatefulWidget {
@override
__AccountPrivacyScreenState createState() => __AccountPrivacyScreenState();
}
class __AccountPrivacyScreenState extends State<_AccountPrivacyScreen> {
class _AccountPrivacySettingsState extends State<AccountPrivacySettings> {
@override
Widget build(BuildContext context) {
return SettingsList(sections: [

22
lib/ui/routes/settings/account_security_settings.dart
View File

@ -13,26 +13,14 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre HUBERT
class AccountSecuritySettingsScreen extends StatelessWidget {
class AccountSecuritySettingsScreen extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(tr("Security settings")),
),
body: _AccountSecuritySettingsScreenBody(),
);
}
_AccountSecuritySettingsScreenState createState() =>
_AccountSecuritySettingsScreenState();
}
class _AccountSecuritySettingsScreenBody extends StatefulWidget {
@override
__AccountSecuritySettingsScreenBodyState createState() =>
__AccountSecuritySettingsScreenBodyState();
}
class __AccountSecuritySettingsScreenBodyState
extends State<_AccountSecuritySettingsScreenBody> {
class _AccountSecuritySettingsScreenState
extends State<AccountSecuritySettingsScreen> {
@override
Widget build(BuildContext context) {
return SettingsList(

194
lib/ui/routes/settings/account_settings_route.dart
View File

@ -5,6 +5,7 @@ import 'package:comunic/ui/routes/settings/application_settings.dart';
import 'package:comunic/ui/routes/settings/custom_emojies_account_settings.dart';
import 'package:comunic/ui/routes/settings/general_account_settings.dart';
import 'package:comunic/utils/intl_utils.dart';
import 'package:comunic/utils/ui_utils.dart';
import 'package:flutter/material.dart';
import 'package:settings_ui/settings_ui.dart';
@ -12,6 +13,23 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre HUBERT
class _SettingsSection {
final String title;
final String subtitle;
final IconData icon;
final Widget Function() onBuild;
const _SettingsSection({
@required this.title,
@required this.subtitle,
@required this.icon,
@required this.onBuild,
}) : assert(title != null),
assert(subtitle != null),
assert(icon != null),
assert(onBuild != null);
}
class AccountSettingsRoute extends StatelessWidget {
@override
Widget build(BuildContext context) {
@ -30,68 +48,126 @@ class _AccountSettingsBody extends StatefulWidget {
}
class __AccountSettingsBodyState extends State<_AccountSettingsBody> {
_SettingsSection _currentSection;
@override
Widget build(BuildContext context) {
return SettingsList(
sections: [
SettingsSection(
title: tr("Account settings"),
tiles: [
// General settings
SettingsTile(
title: tr("General settings"),
subtitle: tr("Configure the main settings of your account"),
leading: Icon(Icons.settings),
onTap: () => _openSection(GeneralAccountSettingsScreen()),
),
void initState() {
super.initState();
// Emoticons
SettingsTile(
title: tr("Custom emojis"),
subtitle: tr("Set your own emoticon shorcuts"),
leading: Icon(Icons.insert_emoticon),
onTap: () => _openSection(CustomEmojisAccountSettings()),
),
// Account image
SettingsTile(
title: tr("Account image"),
subtitle: tr("Customize your account image"),
leading: Icon(Icons.account_circle),
onTap: () => _openSection(AccountImageSettingsScreen()),
),
// Security settings
SettingsTile(
title: tr("Security"),
subtitle: tr("Manage security options of your account"),
leading: Icon(Icons.lock),
onTap: () => _openSection(AccountSecuritySettingsScreen()),
),
// Privacy settings
SettingsTile(
title: tr("Privacy"),
subtitle: tr("Here you can make actions to protect your privacy"),
leading: Icon(Icons.security),
onTap: () => _openSection(AccountPrivacySettings()),
),
// Privacy settings
SettingsTile(
title: tr("Application settings"),
subtitle: tr("Manage local application settings"),
leading: Icon(Icons.smartphone),
onTap: () => _openSection(ApplicationSettings()),
),
],
)
],
);
/// Choose first section by default
_currentSection = _sections[0];
}
/// Open a settings setings
void _openSection(Widget w) {
Navigator.of(context).push(MaterialPageRoute(builder: (c) => w));
/// The list of settings sections
List<_SettingsSection> get _sections => [
_SettingsSection(
title: tr("General settings"),
subtitle: tr("Configure the main settings of your account"),
icon: Icons.settings,
onBuild: () => GeneralAccountSettingsScreen(),
),
// Emoticons
_SettingsSection(
title: tr("Custom emojis"),
subtitle: tr("Set your own emoticon shorcuts"),
icon: Icons.insert_emoticon,
onBuild: () => CustomEmojisAccountSettings(),
),
// Account image
_SettingsSection(
title: tr("Account image"),
subtitle: tr("Customize your account image"),
icon: Icons.account_circle,
onBuild: () => AccountImageSettingsScreen(),
),
// Security settings
_SettingsSection(
title: tr("Security"),
subtitle: tr("Manage security options of your account"),
icon: Icons.lock,
onBuild: () => AccountSecuritySettingsScreen(),
),
// Privacy settings
_SettingsSection(
title: tr("Privacy"),
subtitle: tr("Here you can make actions to protect your privacy"),
icon: Icons.security,
onBuild: () => AccountPrivacySettings(),
),
// Privacy settings
_SettingsSection(
title: tr("Application settings"),
subtitle: tr("Manage local application settings"),
icon: Icons.smartphone,
onBuild: () => ApplicationSettings(),
),
];
@override
Widget build(BuildContext context) =>
isTablet(context) ? _buildTabletMode() : _buildMobileMode();
/// Tablet mode
Widget _buildTabletMode() => Row(
children: <Widget>[
Container(width: 400, child: _buildTabletLeftPane()),
Expanded(child: _currentSection.onBuild())
],
);
Widget _buildTabletLeftPane() => ListView.builder(
itemBuilder: (c, i) {
final section = _sections[i];
return Container(
color: section.title == _currentSection.title
? Colors.black.withAlpha(50)
: null,
child: ListTile(
title: Text(section.title),
subtitle: Text(section.subtitle),
leading: Icon(section.icon),
onTap: () => _openSectionTablet(section),
),
);
},
itemCount: _sections.length,
);
void _openSectionTablet(_SettingsSection s) =>
setState(() => _currentSection = s);
/// Mobile mode
Widget _buildMobileMode() => SettingsList(
sections: [
SettingsSection(
title: tr("Settings"),
tiles: _sections
.map((f) => SettingsTile(
title: f.title,
leading: Icon(f.icon),
subtitle: f.subtitle,
onTap: () => _openSectionsAsNewRoute(f),
))
.toList(),
)
],
);
/// Push a new route with the settings section
_openSectionsAsNewRoute(_SettingsSection f) {
Navigator.of(context).push(MaterialPageRoute(
builder: (c) => Scaffold(
appBar: AppBar(
title: Text(f.title),
),
body: f.onBuild(),
),
));
}
}

20
lib/ui/routes/settings/application_settings.dart
View File

@ -9,24 +9,14 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre Hubert
class ApplicationSettings extends StatelessWidget {
class ApplicationSettings extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(tr("Application settings"))),
body: _ApplicationSettingsScreen(),
);
}
_ApplicationSettingsState createState() =>
_ApplicationSettingsState();
}
class _ApplicationSettingsScreen extends StatefulWidget {
@override
__ApplicationSettingsScreenState createState() =>
__ApplicationSettingsScreenState();
}
class __ApplicationSettingsScreenState
extends State<_ApplicationSettingsScreen> {
class _ApplicationSettingsState
extends State<ApplicationSettings> {
PreferencesHelper _preferencesHelper;
Future<void> _refresh() async {

21
lib/ui/routes/settings/custom_emojies_account_settings.dart
View File

@ -19,25 +19,14 @@ import 'package:flutter/material.dart';
///
/// @author Pierre Hubert
class CustomEmojisAccountSettings extends StatelessWidget {
class CustomEmojisAccountSettings extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(tr("Custom emojies settings")),
),
body: _CustomEmojiesAccountBody(),
);
}
_CustomEmojisAccountSettingsState createState() =>
_CustomEmojisAccountSettingsState();
}
class _CustomEmojiesAccountBody extends StatefulWidget {
@override
_CustomEmojiesAccountBodyState createState() =>
_CustomEmojiesAccountBodyState();
}
class _CustomEmojiesAccountBodyState extends State<_CustomEmojiesAccountBody> {
class _CustomEmojisAccountSettingsState
extends State<CustomEmojisAccountSettings> {
User _user;
final _key = GlobalKey<AsyncScreenWidgetState>();

22
lib/ui/routes/settings/general_account_settings.dart
View File

@ -18,26 +18,14 @@ import 'package:settings_ui/settings_ui.dart';
///
/// @author Pierre HUBERT
class GeneralAccountSettingsScreen extends StatelessWidget {
class GeneralAccountSettingsScreen extends StatefulWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("General settings"),
),
body: _GeneralAccountSettingsBody(),
);
}
_GeneralAccountSettingsScreenState createState() =>
_GeneralAccountSettingsScreenState();
}
class _GeneralAccountSettingsBody extends StatefulWidget {
@override
__GeneralAccountSettingsBodyState createState() =>
__GeneralAccountSettingsBodyState();
}
class __GeneralAccountSettingsBodyState
extends State<_GeneralAccountSettingsBody> {
class _GeneralAccountSettingsScreenState
extends State<GeneralAccountSettingsScreen> {
GeneralSettings _settings;
final _key = GlobalKey<AsyncScreenWidgetState>();