fixes and ui.dart

This commit is contained in:
Mike Schwörer 2024-06-08 12:55:58 +02:00
parent 95d51c82e9
commit 243a274480
Signed by: Mikescher
GPG Key ID: D3C7172E0A70F8CF
9 changed files with 277 additions and 230 deletions

View File

@ -64,13 +64,13 @@ class _SCNNavLayoutState extends State<SCNNavLayout> {
showSearch: _selectedIndex == 0 || _selectedIndex == 1, showSearch: _selectedIndex == 0 || _selectedIndex == 1,
showThemeSwitch: true, showThemeSwitch: true,
), ),
body: LazyIndexedStack( body: IndexedStack(
children: [ children: [
MessageListPage(), ExcludeFocus(excluding: _selectedIndex != 0, child: MessageListPage()),
ChannelRootPage(), ExcludeFocus(excluding: _selectedIndex != 1, child: ChannelRootPage()),
AccountRootPage(), ExcludeFocus(excluding: _selectedIndex != 2, child: AccountRootPage()),
SettingsRootPage(), ExcludeFocus(excluding: _selectedIndex != 3, child: SettingsRootPage()),
SendRootPage(), ExcludeFocus(excluding: _selectedIndex != 4, child: SendRootPage()),
], ],
index: _selectedIndex, index: _selectedIndex,
), ),

View File

@ -11,6 +11,7 @@ import 'package:simplecloudnotifier/state/application_log.dart';
import 'package:simplecloudnotifier/state/globals.dart'; import 'package:simplecloudnotifier/state/globals.dart';
import 'package:simplecloudnotifier/state/app_auth.dart'; import 'package:simplecloudnotifier/state/app_auth.dart';
import 'package:simplecloudnotifier/utils/toaster.dart'; import 'package:simplecloudnotifier/utils/toaster.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
import 'package:uuid/uuid.dart'; import 'package:uuid/uuid.dart';
class AccountRootPage extends StatefulWidget { class AccountRootPage extends StatefulWidget {
@ -143,22 +144,23 @@ class _AccountRootPageState extends State<AccountRootPage> {
), ),
), ),
const SizedBox(height: 32), const SizedBox(height: 32),
FilledButton( UI.button(
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 24), padding: const EdgeInsets.fromLTRB(8, 12, 8, 12)), text: 'Create new account',
onPressed: () { onPressed: () {
if (loading) return; if (loading) return;
_createNewAccount(); _createNewAccount();
}, },
child: const Text('Create new account'), big: true,
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
FilledButton.tonal( UI.button(
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 24), padding: const EdgeInsets.fromLTRB(8, 12, 8, 12)), text: 'Use existing account',
onPressed: () { onPressed: () {
if (loading) return; if (loading) return;
Navigator.push(context, MaterialPageRoute<AccountLoginPage>(builder: (context) => AccountLoginPage())); Navigator.push(context, MaterialPageRoute<AccountLoginPage>(builder: (context) => AccountLoginPage()));
}, },
child: const Text('Use existing account'), tonal: true,
big: true,
), ),
], ],
), ),
@ -167,28 +169,22 @@ class _AccountRootPageState extends State<AccountRootPage> {
} }
Widget _buildShowAccount(BuildContext context, AppAuth acc, User user) { Widget _buildShowAccount(BuildContext context, AppAuth acc, User user) {
//TODO better layout return SingleChildScrollView(
return Column( child: Padding(
children: [ padding: const EdgeInsets.fromLTRB(8.0, 24.0, 8.0, 8.0),
SingleChildScrollView( child: Column(
scrollDirection: Axis.vertical, children: [
child: Padding( _buildHeader(context, user),
padding: const EdgeInsets.fromLTRB(8.0, 24.0, 8.0, 8.0), const SizedBox(height: 16),
child: Column( Text(user.username ?? user.userID, overflow: TextOverflow.ellipsis, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
children: [ const SizedBox(height: 16),
_buildHeader(context, user), ..._buildCards(context, user),
const SizedBox(height: 16), SizedBox(height: 16),
Text(user.username ?? user.userID, overflow: TextOverflow.ellipsis, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)), _buildFooter(context, user),
const SizedBox(height: 16), SizedBox(height: 40),
..._buildCards(context, user), ],
],
),
),
), ),
const Expanded(child: SizedBox(height: 16)), ),
_buildFooter(context, user),
SizedBox(height: 40)
],
); );
} }
@ -275,23 +271,15 @@ class _AccountRootPageState extends State<AccountRootPage> {
Column( Column(
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.start,
children: [ children: [
IconButton( UI.buttonIconOnly(
icon: FaIcon(FontAwesomeIcons.pen),
iconSize: 18,
padding: EdgeInsets.all(4),
constraints: BoxConstraints(),
style: ButtonStyle(tapTargetSize: MaterialTapTargetSize.shrinkWrap),
onPressed: () {/*TODO*/}, onPressed: () {/*TODO*/},
icon: FontAwesomeIcons.pen,
), ),
const SizedBox(height: 4), const SizedBox(height: 4),
if (!user.isPro) if (!user.isPro)
IconButton( UI.buttonIconOnly(
icon: FaIcon(FontAwesomeIcons.cartCircleArrowUp),
iconSize: 18,
padding: EdgeInsets.all(4),
constraints: BoxConstraints(),
style: ButtonStyle(tapTargetSize: MaterialTapTargetSize.shrinkWrap),
onPressed: () {/*TODO*/}, onPressed: () {/*TODO*/},
icon: FontAwesomeIcons.cartCircleArrowUp,
), ),
], ],
), ),
@ -301,132 +289,97 @@ class _AccountRootPageState extends State<AccountRootPage> {
List<Widget> _buildCards(BuildContext context, User user) { List<Widget> _buildCards(BuildContext context, User user) {
return [ return [
Card.filled( UI.buttonCard(
context: context,
margin: EdgeInsets.fromLTRB(0, 4, 0, 4), margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)), child: Row(
color: Theme.of(context).cardTheme.color, children: [
child: InkWell( FutureBuilder(
splashColor: Theme.of(context).splashColor, future: futureSubscriptionCount,
onTap: () {/*TODO*/}, builder: (context, snapshot) {
child: Padding( if (snapshot.connectionState == ConnectionState.done) {
padding: const EdgeInsets.all(16), return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
child: Row( }
children: [ return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
FutureBuilder( },
future: futureSubscriptionCount,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
}
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
},
),
const SizedBox(width: 12),
Text('Subscriptions', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
), const SizedBox(width: 12),
Text('Subscriptions', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
onTap: () {/*TODO*/},
), ),
Card.filled( UI.buttonCard(
context: context,
margin: EdgeInsets.fromLTRB(0, 4, 0, 4), margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)), child: Row(
color: Theme.of(context).cardTheme.color, children: [
child: InkWell( FutureBuilder(
splashColor: Theme.of(context).splashColor, future: futureClientCount,
onTap: () {/*TODO*/}, builder: (context, snapshot) {
child: Padding( if (snapshot.connectionState == ConnectionState.done) {
padding: const EdgeInsets.all(16), return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
child: Row( }
children: [ return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
FutureBuilder( },
future: futureClientCount,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
}
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
},
),
const SizedBox(width: 12),
Text('Clients', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
), const SizedBox(width: 12),
Text('Clients', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
onTap: () {/*TODO*/},
), ),
Card.filled( UI.buttonCard(
context: context,
margin: EdgeInsets.fromLTRB(0, 4, 0, 4), margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)), child: Row(
color: Theme.of(context).cardTheme.color, children: [
child: InkWell( FutureBuilder(
splashColor: Theme.of(context).splashColor, future: futureKeyCount,
onTap: () {/*TODO*/}, builder: (context, snapshot) {
child: Padding( if (snapshot.connectionState == ConnectionState.done) {
padding: const EdgeInsets.all(16), return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
child: Row( }
children: [ return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
FutureBuilder( },
future: futureKeyCount,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
}
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
},
),
const SizedBox(width: 12),
Text('Keys', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
), const SizedBox(width: 12),
Text('Keys', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
onTap: () {/*TODO*/},
), ),
Card.filled( UI.buttonCard(
context: context,
margin: EdgeInsets.fromLTRB(0, 4, 0, 4), margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)), child: Row(
color: Theme.of(context).cardTheme.color, children: [
child: InkWell( FutureBuilder(
splashColor: Theme.of(context).splashColor, future: futureChannelSubscribedCount,
onTap: () {/*TODO*/}, builder: (context, snapshot) {
child: Padding( if (snapshot.connectionState == ConnectionState.done) {
padding: const EdgeInsets.all(16), return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
child: Row( }
children: [ return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
FutureBuilder( },
future: futureChannelSubscribedCount,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text('${snapshot.data}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20));
}
return const SizedBox(width: 12, height: 12, child: Center(child: CircularProgressIndicator()));
},
),
const SizedBox(width: 12),
Text('Channels', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
), const SizedBox(width: 12),
Text('Channels', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
), ),
onTap: () {/*TODO*/},
), ),
Card.filled( UI.buttonCard(
context: context,
margin: EdgeInsets.fromLTRB(0, 4, 0, 4), margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)), child: Row(
color: Theme.of(context).cardTheme.color, children: [
child: InkWell( Text('${user.messagesSent}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
splashColor: Theme.of(context).splashColor, const SizedBox(width: 12),
onTap: () {/*TODO*/}, Text('Messages', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
child: Padding( ],
padding: const EdgeInsets.all(16),
child: Row(
children: [
Text('${user.messagesSent}', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
const SizedBox(width: 12),
Text('Messages', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20)),
],
),
),
), ),
onTap: () {/*TODO*/},
), ),
]; ];
} }
@ -436,9 +389,19 @@ class _AccountRootPageState extends State<AccountRootPage> {
padding: const EdgeInsets.fromLTRB(8, 0, 8, 0), padding: const EdgeInsets.fromLTRB(8, 0, 8, 0),
child: Row( child: Row(
children: [ children: [
Expanded(child: FilledButton(onPressed: _logout, child: Text('Logout'), style: TextButton.styleFrom(backgroundColor: Colors.orange))), Expanded(
child: UI.button(
text: 'Logout',
onPressed: _logout,
color: Colors.orange,
)),
const SizedBox(width: 8), const SizedBox(width: 8),
Expanded(child: FilledButton(onPressed: _deleteAccount, child: Text('Delete Account'), style: TextButton.styleFrom(backgroundColor: Colors.red))), Expanded(
child: UI.button(
text: 'Delete Account',
onPressed: _deleteAccount,
color: Colors.red,
)),
], ],
), ),
); );

View File

@ -9,6 +9,7 @@ import 'package:simplecloudnotifier/state/globals.dart';
import 'package:simplecloudnotifier/state/app_auth.dart'; import 'package:simplecloudnotifier/state/app_auth.dart';
import 'package:simplecloudnotifier/state/token_source.dart'; import 'package:simplecloudnotifier/state/token_source.dart';
import 'package:simplecloudnotifier/utils/toaster.dart'; import 'package:simplecloudnotifier/utils/toaster.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
class AccountLoginPage extends StatefulWidget { class AccountLoginPage extends StatefulWidget {
const AccountLoginPage({super.key}); const AccountLoginPage({super.key});
@ -102,10 +103,10 @@ class _AccountLoginPageState extends State<AccountLoginPage> {
), ),
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
FilledButton( UI.button(
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 24), padding: const EdgeInsets.fromLTRB(8, 12, 8, 12)), text: 'Login',
big: true,
onPressed: _login, onPressed: _login,
child: const Text('Login'),
), ),
], ],
), ),

View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:simplecloudnotifier/utils/toaster.dart'; import 'package:simplecloudnotifier/utils/toaster.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
import 'package:toastification/toastification.dart'; import 'package:toastification/toastification.dart';
class DebugActionsPage extends StatefulWidget { class DebugActionsPage extends StatefulWidget {
@ -17,36 +18,40 @@ class _DebugActionsPageState extends State<DebugActionsPage> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.stretch,
children: [ children: [
FilledButton( UI.button(
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), big: false,
onPressed: () => Toaster.success("Hello World", "This was a triumph!"), onPressed: () => Toaster.success("Hello World", "This was a triumph!"),
child: const Text('Show Success Notification'), text: 'Show Success Notification',
), ),
FilledButton( SizedBox(height: 4),
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), UI.button(
big: false,
onPressed: () => Toaster.info("Hello World", "This was a triumph!"), onPressed: () => Toaster.info("Hello World", "This was a triumph!"),
child: const Text('Show Info Notification'), text: 'Show Info Notification',
), ),
FilledButton( SizedBox(height: 4),
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), UI.button(
big: false,
onPressed: () => Toaster.warn("Hello World", "This was a triumph!"), onPressed: () => Toaster.warn("Hello World", "This was a triumph!"),
child: const Text('Show Warn Notification'), text: 'Show Warn Notification',
), ),
FilledButton( SizedBox(height: 4),
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), UI.button(
big: false,
onPressed: () => Toaster.error("Hello World", "This was a triumph!"), onPressed: () => Toaster.error("Hello World", "This was a triumph!"),
child: const Text('Show Info Notification'), text: 'Show Info Notification',
), ),
FilledButton( SizedBox(height: 4),
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), UI.button(
big: false,
onPressed: () => Toaster.simple("Hello World"), onPressed: () => Toaster.simple("Hello World"),
child: const Text('Show Simple Notification'), text: 'Show Simple Notification',
), ),
SizedBox(height: 20), SizedBox(height: 20),
FilledButton( UI.button(
style: FilledButton.styleFrom(textStyle: const TextStyle(fontSize: 20)), big: false,
onPressed: _sendTokenToServer, onPressed: _sendTokenToServer,
child: const Text('Send FCM Token to Server'), text: 'Send FCM Token to Server',
), ),
], ],
), ),

View File

@ -4,6 +4,7 @@ import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:simplecloudnotifier/components/layout/scaffold.dart'; import 'package:simplecloudnotifier/components/layout/scaffold.dart';
import 'package:simplecloudnotifier/state/request_log.dart'; import 'package:simplecloudnotifier/state/request_log.dart';
import 'package:simplecloudnotifier/utils/toaster.dart'; import 'package:simplecloudnotifier/utils/toaster.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
class DebugRequestViewPage extends StatelessWidget { class DebugRequestViewPage extends StatelessWidget {
final SCNRequest request; final SCNRequest request;
@ -55,17 +56,13 @@ class DebugRequestViewPage extends StatelessWidget {
Expanded( Expanded(
child: Text(title, style: TextStyle(fontWeight: FontWeight.bold)), child: Text(title, style: TextStyle(fontWeight: FontWeight.bold)),
), ),
IconButton( UI.buttonIconOnly(
icon: FaIcon(
FontAwesomeIcons.copy,
),
iconSize: 14, iconSize: 14,
padding: EdgeInsets.fromLTRB(0, 0, 4, 0),
constraints: BoxConstraints(),
onPressed: () { onPressed: () {
Clipboard.setData(new ClipboardData(text: value)); Clipboard.setData(new ClipboardData(text: title));
Toaster.info("Clipboard", 'Copied text to Clipboard'); Toaster.info("Clipboard", 'Copied text to Clipboard');
}, },
icon: FontAwesomeIcons.copy,
), ),
], ],
), ),

View File

@ -5,6 +5,7 @@ import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:simplecloudnotifier/models/channel.dart'; import 'package:simplecloudnotifier/models/channel.dart';
import 'package:simplecloudnotifier/models/message.dart'; import 'package:simplecloudnotifier/models/message.dart';
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
class MessageListItem extends StatelessWidget { class MessageListItem extends StatelessWidget {
static final _dateFormat = DateFormat('yyyy-MM-dd kk:mm'); static final _dateFormat = DateFormat('yyyy-MM-dd kk:mm');
@ -102,19 +103,10 @@ class MessageListItem extends StatelessWidget {
if (message.priority == 2) SizedBox(width: 4), if (message.priority == 2) SizedBox(width: 4),
if (message.priority == 0) FaIcon(FontAwesomeIcons.solidDown, size: 16, color: Colors.lightBlue[900]), if (message.priority == 0) FaIcon(FontAwesomeIcons.solidDown, size: 16, color: Colors.lightBlue[900]),
if (message.priority == 0) SizedBox(width: 4), if (message.priority == 0) SizedBox(width: 4),
Container( UI.channelChip(
padding: const EdgeInsets.fromLTRB(4, 0, 4, 0), context: context,
margin: const EdgeInsets.fromLTRB(0, 0, 4, 0), text: resolveChannelName(message),
decoration: BoxDecoration( margin: EdgeInsets.fromLTRB(0, 0, 4, 0),
color: Theme.of(context).hintColor,
borderRadius: BorderRadius.all(Radius.circular(4)),
),
child: Text(
resolveChannelName(message),
style: TextStyle(fontWeight: FontWeight.bold, color: Theme.of(context).cardColor, fontSize: 12),
overflow: TextOverflow.clip,
maxLines: 1,
),
), ),
Expanded(child: SizedBox()), Expanded(child: SizedBox()),
Text( Text(

View File

@ -12,6 +12,7 @@ import 'package:simplecloudnotifier/models/keytoken.dart';
import 'package:simplecloudnotifier/models/message.dart'; import 'package:simplecloudnotifier/models/message.dart';
import 'package:simplecloudnotifier/models/user.dart'; import 'package:simplecloudnotifier/models/user.dart';
import 'package:simplecloudnotifier/state/app_auth.dart'; import 'package:simplecloudnotifier/state/app_auth.dart';
import 'package:simplecloudnotifier/utils/ui.dart';
class MessageViewPage extends StatefulWidget { class MessageViewPage extends StatefulWidget {
const MessageViewPage({super.key, required this.message}); const MessageViewPage({super.key, required this.message});
@ -129,19 +130,11 @@ class _MessageViewPageState extends State<MessageViewPage> {
return [ return [
Row( Row(
children: [ children: [
Container( UI.channelChip(
padding: const EdgeInsets.fromLTRB(4, 0, 4, 0), context: context,
text: _resolveChannelName(channel, message),
margin: const EdgeInsets.fromLTRB(0, 0, 4, 0), margin: const EdgeInsets.fromLTRB(0, 0, 4, 0),
decoration: BoxDecoration( fontSize: 16,
color: Theme.of(context).hintColor,
borderRadius: BorderRadius.all(Radius.circular(4)),
),
child: Text(
_resolveChannelName(channel, message),
style: TextStyle(fontWeight: FontWeight.bold, color: Theme.of(context).cardColor, fontSize: 16),
overflow: TextOverflow.clip,
maxLines: 1,
),
), ),
Expanded(child: SizedBox()), Expanded(child: SizedBox()),
Text(_dateFormat.format(DateTime.parse(message.timestamp)), style: const TextStyle(fontSize: 14)), Text(_dateFormat.format(DateTime.parse(message.timestamp)), style: const TextStyle(fontSize: 14)),
@ -157,29 +150,18 @@ class _MessageViewPageState extends State<MessageViewPage> {
Row( Row(
children: [ children: [
Expanded(child: SizedBox()), Expanded(child: SizedBox()),
IconButton( UI.buttonIconOnly(
icon: FaIcon(FontAwesomeIcons.copy),
iconSize: 18,
padding: EdgeInsets.all(4),
constraints: BoxConstraints(),
style: ButtonStyle(tapTargetSize: MaterialTapTargetSize.shrinkWrap),
onPressed: () {/*TODO*/}, onPressed: () {/*TODO*/},
icon: FontAwesomeIcons.copy,
), ),
IconButton( UI.buttonIconOnly(
icon: FaIcon(FontAwesomeIcons.lineColumns), icon: FontAwesomeIcons.lineColumns,
iconSize: 18,
padding: EdgeInsets.all(4),
constraints: BoxConstraints(),
style: ButtonStyle(tapTargetSize: MaterialTapTargetSize.shrinkWrap),
onPressed: () {/*TODO*/}, onPressed: () {/*TODO*/},
), ),
], ],
), ),
Container( UI.box(
decoration: BoxDecoration( context: context,
border: Border.all(color: Theme.of(context).hintColor),
borderRadius: BorderRadius.circular(4),
),
padding: const EdgeInsets.all(4), padding: const EdgeInsets.all(4),
child: Text(message.content ?? ''), child: Text(message.content ?? ''),
), ),
@ -187,12 +169,9 @@ class _MessageViewPageState extends State<MessageViewPage> {
} }
Widget _buildMetaCard(BuildContext context, IconData icn, String title, List<String> values, void Function()? action) { Widget _buildMetaCard(BuildContext context, IconData icn, String title, List<String> values, void Function()? action) {
final container = Container( final container = UI.box(
context: context,
padding: EdgeInsets.fromLTRB(16, 2, 4, 2), padding: EdgeInsets.fromLTRB(16, 2, 4, 2),
decoration: BoxDecoration(
border: Border.all(color: Theme.of(context).hintColor),
borderRadius: BorderRadius.circular(4),
),
child: Row( child: Row(
children: [ children: [
FaIcon(icn, size: 18), FaIcon(icn, size: 18),

View File

@ -0,0 +1 @@
class Navi {}

109
flutter/lib/utils/ui.dart Normal file
View File

@ -0,0 +1,109 @@
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
class UI {
static const double DefaultBorderRadius = 4;
static Widget button({required String text, required void Function() onPressed, bool big = false, Color? color = null, bool tonal = false, IconData? icon = null}) {
final double fontSize = big ? 24 : 14;
final padding = big ? EdgeInsets.fromLTRB(8, 12, 8, 12) : null;
final style = FilledButton.styleFrom(
textStyle: TextStyle(fontSize: fontSize),
padding: padding,
backgroundColor: color,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(DefaultBorderRadius)),
);
if (tonal) {
if (icon != null) {
return FilledButton.tonalIcon(
style: style,
onPressed: onPressed,
icon: Icon(icon),
label: Text(text),
);
} else {
return FilledButton.tonal(
style: style,
onPressed: onPressed,
child: Text(text),
);
}
} else {
if (icon != null) {
return FilledButton.icon(
style: style,
onPressed: onPressed,
icon: Icon(icon),
label: Text(text),
);
} else {
return FilledButton(
style: style,
onPressed: onPressed,
child: Text(text),
);
}
}
}
static Widget buttonIconOnly({
required void Function() onPressed,
required IconData icon,
double? iconSize = null,
}) {
return IconButton(
icon: FaIcon(icon),
iconSize: iconSize ?? 18,
padding: EdgeInsets.all(4),
constraints: BoxConstraints(),
style: ButtonStyle(tapTargetSize: MaterialTapTargetSize.shrinkWrap),
onPressed: onPressed,
);
}
static Widget buttonCard({required BuildContext context, required Widget child, required void Function() onTap, EdgeInsets? margin = null}) {
return Card.filled(
margin: margin,
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(DefaultBorderRadius)),
color: Theme.of(context).cardTheme.color,
child: InkWell(
splashColor: Theme.of(context).splashColor,
onTap: onTap,
child: Padding(
padding: const EdgeInsets.all(16),
child: child,
),
),
);
}
static Widget channelChip({required BuildContext context, required String text, EdgeInsets? margin = null, double fontSize = 12}) {
return Container(
padding: const EdgeInsets.fromLTRB(4, 0, 4, 0),
margin: margin,
decoration: BoxDecoration(
color: Theme.of(context).hintColor,
borderRadius: BorderRadius.all(Radius.circular(DefaultBorderRadius)),
),
child: Text(
text,
style: TextStyle(fontWeight: FontWeight.bold, color: Theme.of(context).cardColor, fontSize: fontSize),
overflow: TextOverflow.clip,
maxLines: 1,
),
);
}
static Widget box({required BuildContext context, required Widget child, required EdgeInsets? padding}) {
return Container(
padding: padding ?? EdgeInsets.all(4),
decoration: BoxDecoration(
border: Border.all(color: Theme.of(context).hintColor),
borderRadius: BorderRadius.circular(DefaultBorderRadius),
),
child: child,
);
}
}