Skip to content

Commit 111eda9

Browse files
fadi-georgefadi-george
committed
tweak demo ui
1 parent ffe1298 commit 111eda9

15 files changed

Lines changed: 84 additions & 61 deletions

‎examples/demo/lib/screens/home_screen.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ class _HomeScreenState extends State<HomeScreen> {
6767

6868
return Scaffold(
6969
appBar: AppBar(
70+
centerTitle: true,
7071
title: Row(
7172
mainAxisSize: MainAxisSize.min,
7273
children: [

‎examples/demo/lib/theme.dart‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,13 @@
11
import 'package:flutter/material.dart';
22

3+
class AppSpacing {
4+
static const double gap = 8;
5+
static const gapBox = SizedBox(height: gap);
6+
static const cardPadding = EdgeInsets.symmetric(horizontal: 12, vertical: 12);
7+
8+
AppSpacing._();
9+
}
10+
311
class AppColors {
412
static const oneSignalRed = Color(0xFFE54B4D);
513
static const oneSignalGreen = Color(0xFF34A853);

‎examples/demo/lib/widgets/section_card.dart‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import 'package:flutter/material.dart';
22

3+
import '../theme.dart';
4+
35
class SectionCard extends StatelessWidget {
46
final String title;
57
final VoidCallback? onInfoTap;
@@ -15,13 +17,13 @@ class SectionCard extends StatelessWidget {
1517
@override
1618
Widget build(BuildContext context) {
1719
return Padding(
18-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
20+
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
1921
child: Column(
2022
crossAxisAlignment: CrossAxisAlignment.start,
2123
children: [
2224
// Section header (outside card, ALL CAPS like reference)
2325
Padding(
24-
padding: const EdgeInsets.only(bottom: 6),
26+
padding: EdgeInsets.only(bottom: AppSpacing.gap),
2527
child: Row(
2628
children: [
2729
Expanded(

‎examples/demo/lib/widgets/sections/aliases_section.dart‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

4+
import '../../theme.dart';
45
import '../../viewmodels/app_viewmodel.dart';
56
import '../action_button.dart';
67
import '../dialogs.dart';
@@ -24,14 +25,14 @@ class AliasesSection extends StatelessWidget {
2425
Card(
2526
margin: EdgeInsets.zero,
2627
child: Padding(
27-
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
28+
padding: AppSpacing.cardPadding,
2829
child: PairList(
2930
items: vm.aliasesList,
3031
emptyText: 'No aliases added',
3132
),
3233
),
3334
),
34-
const SizedBox(height: 8),
35+
AppSpacing.gapBox,
3536
PrimaryButton(
3637
label: 'ADD',
3738
onPressed: () async {
@@ -48,7 +49,7 @@ class AliasesSection extends StatelessWidget {
4849
}
4950
},
5051
),
51-
const SizedBox(height: 8),
52+
AppSpacing.gapBox,
5253
PrimaryButton(
5354
label: 'ADD MULTIPLE',
5455
onPressed: () async {

‎examples/demo/lib/widgets/sections/app_section.dart‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -28,10 +28,10 @@ class AppSection extends StatelessWidget {
2828
Card(
2929
margin: EdgeInsets.zero,
3030
child: Padding(
31-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
31+
padding: AppSpacing.cardPadding,
3232
child: Row(
3333
children: [
34-
const Text('App ID', style: TextStyle(fontSize: 14)),
34+
Text('App ID', style: Theme.of(context).textTheme.bodyMedium),
3535
const SizedBox(width: 12),
3636
Expanded(
3737
child: SelectableText(
@@ -47,7 +47,7 @@ class AppSection extends StatelessWidget {
4747
),
4848
),
4949
),
50-
const SizedBox(height: 8),
50+
AppSpacing.gapBox,
5151

5252
// Guidance banner
5353
Container(
@@ -64,7 +64,7 @@ class AppSection extends StatelessWidget {
6464
'Add your own App ID, then rebuild to fully test all functionality.',
6565
style: TextStyle(fontSize: 13),
6666
),
67-
const SizedBox(height: 4),
67+
AppSpacing.gapBox,
6868
GestureDetector(
6969
onTap: () => launchUrl(
7070
Uri.parse('https://onesignal.com'),
@@ -82,13 +82,13 @@ class AppSection extends StatelessWidget {
8282
],
8383
),
8484
),
85-
const SizedBox(height: 8),
85+
AppSpacing.gapBox,
8686

8787
// Consent card
8888
Card(
8989
margin: EdgeInsets.zero,
9090
child: Padding(
91-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
91+
padding: AppSpacing.cardPadding,
9292
child: Column(
9393
children: [
9494
ToggleRow(
@@ -110,11 +110,11 @@ class AppSection extends StatelessWidget {
110110
),
111111
),
112112
),
113-
const SizedBox(height: 16),
113+
const SizedBox(height: 24),
114114

115115
// USER section header
116116
Padding(
117-
padding: const EdgeInsets.only(bottom: 6),
117+
padding: EdgeInsets.only(bottom: AppSpacing.gap),
118118
child: Text(
119119
'USER',
120120
style: Theme.of(context).textTheme.bodySmall?.copyWith(
@@ -129,7 +129,7 @@ class AppSection extends StatelessWidget {
129129
Card(
130130
margin: EdgeInsets.zero,
131131
child: Padding(
132-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
132+
padding: AppSpacing.cardPadding,
133133
child: Column(
134134
children: [
135135
Row(
@@ -168,7 +168,7 @@ class AppSection extends StatelessWidget {
168168
),
169169
),
170170
),
171-
const SizedBox(height: 8),
171+
AppSpacing.gapBox,
172172

173173
// Login / Switch User button
174174
PrimaryButton(
@@ -184,7 +184,7 @@ class AppSection extends StatelessWidget {
184184
},
185185
),
186186
if (vm.isLoggedIn) ...[
187-
const SizedBox(height: 8),
187+
AppSpacing.gapBox,
188188

189189
// Logout button
190190
DestructiveButton(

‎examples/demo/lib/widgets/sections/emails_section.dart‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

4+
import '../../theme.dart';
45
import '../../viewmodels/app_viewmodel.dart';
56
import '../action_button.dart';
67
import '../dialogs.dart';
@@ -24,15 +25,15 @@ class EmailsSection extends StatelessWidget {
2425
Card(
2526
margin: EdgeInsets.zero,
2627
child: Padding(
27-
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
28+
padding: AppSpacing.cardPadding,
2829
child: CollapsibleList(
2930
items: vm.emailsList,
3031
emptyText: 'No emails added',
3132
onDelete: vm.removeEmail,
3233
),
3334
),
3435
),
35-
const SizedBox(height: 8),
36+
AppSpacing.gapBox,
3637
PrimaryButton(
3738
label: 'ADD EMAIL',
3839
onPressed: () async {

‎examples/demo/lib/widgets/sections/in_app_section.dart‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

4+
import '../../theme.dart';
45
import '../../viewmodels/app_viewmodel.dart';
56
import '../section_card.dart';
67
import '../toggle_row.dart';
@@ -20,7 +21,7 @@ class InAppSection extends StatelessWidget {
2021
child: Card(
2122
margin: EdgeInsets.zero,
2223
child: Padding(
23-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
24+
padding: AppSpacing.cardPadding,
2425
child: ToggleRow(
2526
label: 'Pause In-App Messages',
2627
description: 'Toggle in-app message display',

‎examples/demo/lib/widgets/sections/location_section.dart‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

4+
import '../../theme.dart';
45
import '../../viewmodels/app_viewmodel.dart';
56
import '../action_button.dart';
67
import '../section_card.dart';
@@ -23,7 +24,7 @@ class LocationSection extends StatelessWidget {
2324
Card(
2425
margin: EdgeInsets.zero,
2526
child: Padding(
26-
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
27+
padding: AppSpacing.cardPadding,
2728
child: ToggleRow(
2829
label: 'Location Shared',
2930
description: 'Share device location with OneSignal',
@@ -32,7 +33,7 @@ class LocationSection extends StatelessWidget {
3233
),
3334
),
3435
),
35-
const SizedBox(height: 8),
36+
AppSpacing.gapBox,
3637
PrimaryButton(
3738
label: 'PROMPT LOCATION',
3839
onPressed: vm.promptLocation,

‎examples/demo/lib/widgets/sections/push_section.dart‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

4+
import '../../theme.dart';
45
import '../../viewmodels/app_viewmodel.dart';
56
import '../action_button.dart';
67
import '../section_card.dart';
@@ -23,14 +24,14 @@ class PushSection extends StatelessWidget {
2324
Card(
2425
margin: EdgeInsets.zero,
2526
child: Padding(
26-
padding: const EdgeInsets.all(16),
27+
padding: AppSpacing.cardPadding,
2728
child: Column(
2829
children: [
2930
Row(
3031
children: [
31-
const Text(
32+
Text(
3233
'Push ID',
33-
style: TextStyle(fontSize: 14),
34+
style: Theme.of(context).textTheme.bodyMedium,
3435
),
3536
const SizedBox(width: 12),
3637
Expanded(
@@ -58,7 +59,7 @@ class PushSection extends StatelessWidget {
5859
),
5960
),
6061
if (!vm.hasNotificationPermission) ...[
61-
const SizedBox(height: 8),
62+
AppSpacing.gapBox,
6263
PrimaryButton(
6364
label: 'PROMPT PUSH',
6465
onPressed: vm.promptPush,

‎examples/demo/lib/widgets/sections/send_iam_section.dart‎

Lines changed: 20 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
22
import 'package:provider/provider.dart';
33

44
import '../../models/in_app_message_type.dart';
5+
import '../../theme.dart';
56
import '../../viewmodels/app_viewmodel.dart';
67
import '../section_card.dart';
78

@@ -18,30 +19,28 @@ class SendIamSection extends StatelessWidget {
1819
title: 'Send In-App Message',
1920
onInfoTap: onInfoTap,
2021
child: Column(
22+
spacing: AppSpacing.gap,
2123
children: InAppMessageType.values.map((type) {
22-
return Padding(
23-
padding: const EdgeInsets.only(bottom: 8),
24-
child: SizedBox(
25-
width: double.infinity,
26-
child: ElevatedButton(
27-
onPressed: () => vm.sendInAppMessage(type),
28-
style: ElevatedButton.styleFrom(
29-
backgroundColor: const Color(0xFFE9444E),
30-
foregroundColor: Colors.white,
31-
minimumSize: const Size(double.infinity, 48),
32-
shape: RoundedRectangleBorder(
33-
borderRadius: BorderRadius.circular(8),
34-
),
35-
),
36-
child: Row(
37-
mainAxisAlignment: MainAxisAlignment.start,
38-
children: [
39-
Icon(type.icon, size: 18),
40-
const SizedBox(width: 8),
41-
Text(type.label.toUpperCase()),
42-
],
24+
return SizedBox(
25+
width: double.infinity,
26+
child: ElevatedButton(
27+
onPressed: () => vm.sendInAppMessage(type),
28+
style: ElevatedButton.styleFrom(
29+
backgroundColor: const Color(0xFFE9444E),
30+
foregroundColor: Colors.white,
31+
minimumSize: const Size(double.infinity, 48),
32+
shape: RoundedRectangleBorder(
33+
borderRadius: BorderRadius.circular(8),
4334
),
4435
),
36+
child: Row(
37+
mainAxisAlignment: MainAxisAlignment.start,
38+
children: [
39+
Icon(type.icon, size: 18),
40+
const SizedBox(width: 8),
41+
Text(type.label.toUpperCase()),
42+
],
43+
),
4544
),
4645
);
4746
}).toList(),

0 commit comments

Comments
 (0)