More UI updates
This commit is contained in:
parent
aa2d8db85f
commit
96e9c19147
|
@ -49,6 +49,9 @@ class MyApp extends StatelessWidget {
|
|||
brightness: Brightness.dark,
|
||||
colorScheme: darkColorScheme,
|
||||
useMaterial3: true,
|
||||
navigationRailTheme: const NavigationRailThemeData(
|
||||
unselectedLabelTextStyle: TextStyle(fontSize: 13),
|
||||
selectedLabelTextStyle: TextStyle(fontSize: 13)),
|
||||
);
|
||||
|
||||
return MaterialApp(
|
||||
|
@ -130,13 +133,13 @@ class _MyHomePageState extends State<MyHomePage> {
|
|||
selectedIndex: _selectedTab,
|
||||
destinations: const <Widget>[
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.calendar_month_outlined),
|
||||
selectedIcon: Icon(Icons.calendar_month),
|
||||
label: 'Calendar',
|
||||
icon: Icon(Icons.date_range_outlined),
|
||||
selectedIcon: Icon(Icons.date_range),
|
||||
label: 'Range',
|
||||
),
|
||||
NavigationDestination(
|
||||
icon: Icon(Icons.calendar_today_outlined),
|
||||
selectedIcon: Icon(Icons.calendar_today),
|
||||
icon: Icon(Icons.today_outlined),
|
||||
selectedIcon: Icon(Icons.today),
|
||||
label: 'Day',
|
||||
),
|
||||
NavigationDestination(
|
||||
|
@ -162,13 +165,13 @@ class _MyHomePageState extends State<MyHomePage> {
|
|||
extended: extendedValue,
|
||||
destinations: const [
|
||||
NavigationRailDestination(
|
||||
icon: Icon(Icons.calendar_month_outlined),
|
||||
selectedIcon: Icon(Icons.calendar_month),
|
||||
label: Text('Calendar'),
|
||||
icon: Icon(Icons.date_range_outlined),
|
||||
selectedIcon: Icon(Icons.date_range),
|
||||
label: Text('Range'),
|
||||
),
|
||||
NavigationRailDestination(
|
||||
icon: Icon(Icons.calendar_today_outlined),
|
||||
selectedIcon: Icon(Icons.calendar_today),
|
||||
icon: Icon(Icons.today_outlined),
|
||||
selectedIcon: Icon(Icons.today),
|
||||
label: Text('Day'),
|
||||
),
|
||||
NavigationRailDestination(
|
||||
|
|
|
@ -33,6 +33,7 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
|
||||
final startDate = _selectedDateRange?.start ?? DateTime(2020, 1, 1);
|
||||
final endDate = _selectedDateRange?.end ?? DateTime(2022, 1, 1);
|
||||
final textTheme = Theme.of(context).textTheme;
|
||||
|
||||
int diffD = GregorianDate.differenceInDays(startDate, endDate);
|
||||
|
||||
|
@ -45,16 +46,42 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
|
||||
return Scaffold(
|
||||
body: _selectedDateRange == null
|
||||
? const Padding(
|
||||
? Padding(
|
||||
padding: EdgeInsets.all(16),
|
||||
child: Center(
|
||||
child:
|
||||
Text('Select the date range by using the calendar button'),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.date_range_outlined,
|
||||
size: 150,
|
||||
),
|
||||
Text('Date Range',
|
||||
style: TextStyle(
|
||||
fontSize: textTheme.displaySmall?.fontSize,
|
||||
fontWeight: FontWeight.bold)),
|
||||
Text('Select the date range',
|
||||
style: TextStyle(
|
||||
fontSize: textTheme.bodyMedium?.fontSize,
|
||||
))
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(children: [
|
||||
child: ListView(children: [
|
||||
Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Row(
|
||||
children: <Widget>[
|
||||
Text("Range",
|
||||
style: TextStyle(
|
||||
fontSize: textTheme.displaySmall?.fontSize,
|
||||
fontWeight: FontWeight.bold))
|
||||
],
|
||||
)),
|
||||
Card(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
|
@ -64,11 +91,7 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text("Difference",
|
||||
style: TextStyle(
|
||||
fontSize: 40,
|
||||
)),
|
||||
const Text("Date Range",
|
||||
const Text("Full Format",
|
||||
style: TextStyle(fontSize: 14)),
|
||||
Text(
|
||||
"${diffYMD[3]} days \n${diffYMD[2]} weeks \n${diffYMD[1]} months\n${diffYMD[0]} years",
|
||||
|
@ -76,7 +99,7 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold)),
|
||||
const SizedBox(height: 10),
|
||||
const Text("Date Range in days",
|
||||
const Text("Days Format",
|
||||
style: TextStyle(fontSize: 14)),
|
||||
Text("$diffD days",
|
||||
style: const TextStyle(
|
||||
|
@ -86,6 +109,16 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
),
|
||||
))),
|
||||
const SizedBox(height: 16),
|
||||
Container(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Row(
|
||||
children: <Widget>[
|
||||
Text("Dates",
|
||||
style: TextStyle(
|
||||
fontSize: textTheme.displaySmall?.fontSize,
|
||||
fontWeight: FontWeight.bold))
|
||||
],
|
||||
)),
|
||||
Card(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
|
@ -95,10 +128,8 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text("Dates", style: TextStyle(fontSize: 40)),
|
||||
const Text("Start Date",
|
||||
style: TextStyle(fontSize: 14)),
|
||||
const SizedBox(height: 5),
|
||||
Text(
|
||||
startDateString,
|
||||
style: const TextStyle(
|
||||
|
@ -107,7 +138,6 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
const SizedBox(height: 10),
|
||||
const Text("End Date",
|
||||
style: TextStyle(fontSize: 14)),
|
||||
const SizedBox(height: 5),
|
||||
Text(endDateString,
|
||||
style: const TextStyle(
|
||||
fontSize: 22, fontWeight: FontWeight.bold)),
|
||||
|
@ -119,7 +149,7 @@ class _CalendarScreenState extends State<CalendarScreen> {
|
|||
// This button is used to show the date range picker
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: showRangeDialog,
|
||||
child: const Icon(Icons.date_range),
|
||||
child: const Icon(Icons.edit_calendar),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
@ -102,7 +102,7 @@ class _DayScreenState extends State<DayScreen> {
|
|||
// This button is used to show the date range picker
|
||||
floatingActionButton: FloatingActionButton(
|
||||
onPressed: showDateDialog,
|
||||
child: const Icon(Icons.today),
|
||||
child: const Icon(Icons.border_color_outlined),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
@ -7,6 +7,8 @@ const matrixSVG = "assets/app_icons/external/Matrix.svg";
|
|||
const telegramSVG = "assets/app_icons/external/Telegram.svg";
|
||||
|
||||
Future<void> communityDialogBuilder(BuildContext context) {
|
||||
final colorMode = Theme.of(context).colorScheme.primary;
|
||||
|
||||
return showDialog<void>(
|
||||
context: context,
|
||||
builder: (BuildContext context) {
|
||||
|
@ -24,8 +26,7 @@ Future<void> communityDialogBuilder(BuildContext context) {
|
|||
child: SvgPicture.asset(
|
||||
discordSVG,
|
||||
semanticsLabel: 'Discord Logo',
|
||||
colorFilter:
|
||||
const ColorFilter.mode(Colors.white, BlendMode.srcIn),
|
||||
colorFilter: ColorFilter.mode(colorMode, BlendMode.srcIn),
|
||||
width: 50,
|
||||
height: 50,
|
||||
),
|
||||
|
@ -49,14 +50,17 @@ Future<void> communityDialogBuilder(BuildContext context) {
|
|||
child: SvgPicture.asset(
|
||||
matrixSVG,
|
||||
semanticsLabel: 'Matrix Logo',
|
||||
colorFilter:
|
||||
const ColorFilter.mode(Colors.white, BlendMode.srcIn),
|
||||
colorFilter: ColorFilter.mode(colorMode, BlendMode.srcIn),
|
||||
width: 50,
|
||||
height: 50,
|
||||
),
|
||||
),
|
||||
const Expanded(
|
||||
child: Text('Matrix', textAlign: TextAlign.center),
|
||||
child: Text(
|
||||
'Matrix',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(fontSize: 20),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
@ -72,8 +76,7 @@ Future<void> communityDialogBuilder(BuildContext context) {
|
|||
child: SvgPicture.asset(
|
||||
telegramSVG,
|
||||
semanticsLabel: 'Telegram Logo',
|
||||
colorFilter:
|
||||
const ColorFilter.mode(Colors.white, BlendMode.srcIn),
|
||||
colorFilter: ColorFilter.mode(colorMode, BlendMode.srcIn),
|
||||
width: 50,
|
||||
height: 50,
|
||||
),
|
||||
|
|
Loading…
Reference in New Issue