Skip to content

Commit 155ae94

Browse files
Merge pull request #44 from TransactionProcessing/task/#26_uistylingvoucher
Voucher Styling Added
2 parents caa04de + 23ce7a7 commit 155ae94

12 files changed

+114
-128
lines changed

TransactionMobile.Maui/Pages/LoginPage.xaml

Lines changed: 11 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -8,48 +8,33 @@
88
BackgroundColor="White">
99
<ContentPage.Content>
1010
<!-- Main structure-->
11-
<Grid>
12-
<Grid.RowDefinitions>
13-
<RowDefinition Height="Auto"></RowDefinition>
14-
<RowDefinition Height="Auto"></RowDefinition>
15-
<RowDefinition Height="Auto"></RowDefinition>
16-
</Grid.RowDefinitions>
11+
<VerticalStackLayout x:Name="MainLayout">
1712
<!--Main image-->
18-
<Image Grid.RowSpan="2" Grid.Row="0" Source="Resources/loginimage.jpg" VerticalOptions="Start" Aspect="AspectFit"/>
13+
<Image Source="Resources/loginimage.jpg" VerticalOptions="Start" Aspect="AspectFit"/>
1914

2015
<!-- Title-->
21-
<Label Grid.Row="1" Text="Log In" FontSize="34" VerticalOptions="End" FontAttributes="Bold" Padding="20,0,0,20"/>
16+
<Label Text="Log In" FontSize="34" HorizontalOptions="Center" FontAttributes="Bold" Padding="20,0,0,20"/>
2217

23-
<Frame Grid.Row="2" HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand"
18+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand"
2419
CornerRadius="20" Opacity="0.9" BackgroundColor="#E5E9F0">
25-
<Grid ColumnDefinitions="Auto,*">
26-
<Grid.RowDefinitions>
27-
<RowDefinition Height="50"></RowDefinition>
28-
<RowDefinition Height="50"></RowDefinition>
29-
<RowDefinition Height="50"></RowDefinition>
30-
<RowDefinition Height="50"></RowDefinition>
31-
</Grid.RowDefinitions>
20+
<VerticalStackLayout x:Name="SubLayout">
3221

3322
<Entry x:Name="UserNameEntry"
34-
Grid.Row="0"
3523
Placeholder="User name or email address"
3624
AutomationId="UserNameEntry"
37-
Style="{DynamicResource UserNameEntryStyle}"
38-
Grid.ColumnSpan="2">
25+
Style="{DynamicResource UserNameEntryStyle}">
3926
</Entry>
4027

4128
<Entry x:Name="PasswordEntry"
42-
Grid.Row="1"
4329
Placeholder="******"
4430
AutomationId="PasswordEntry"
45-
Style="{DynamicResource PasswordEntryStyle}"
46-
Grid.ColumnSpan="2">
31+
Style="{DynamicResource PasswordEntryStyle}">
4732
</Entry>
4833

49-
<Button Grid.ColumnSpan="2" Grid.Row="2" Text="Continue" Style="{StaticResource StandardButton}" Command="{Binding LoginCommand}"/>
50-
<Label Grid.ColumnSpan="2" Grid.Row="3" Text="Forgot your password?" TextColor="{StaticResource P}" FontAttributes="Bold"/>
51-
</Grid>
34+
<Button Text="Continue" Style="{StaticResource StandardButton}" Command="{Binding LoginCommand}"/>
35+
<!--<Label Grid.ColumnSpan="2" Grid.Row="3" Text="Forgot your password?" TextColor="{StaticResource P}" FontAttributes="Bold"/>-->
36+
</VerticalStackLayout>
5237
</Frame>
53-
</Grid>
38+
</VerticalStackLayout>
5439
</ContentPage.Content>
5540
</ContentPage>

TransactionMobile.Maui/Pages/Transactions/MobileTopup/MobileTopupPerformTopupPage.xaml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,6 @@
5454
Style="{DynamicResource MobileTopupButtonStyle}"
5555
Command="{Binding PerformTopupCommand}"
5656
AutomationId="PerformTopupButton"/>
57-
<!--Style="{DynamicResource MobileTopupButtonStyle}"-->
5857
</VerticalStackLayout>
5958
</Frame>
6059
</VerticalStackLayout>

TransactionMobile.Maui/Pages/Transactions/MobileTopup/MobileTopupPerformTopupPage.xaml.cs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ public MobileTopupPerformTopupPage(MobileTopupPerformTopupPageViewModel vm)
1313
BindingContext = vm;
1414
vm.OnCustomerMobileNumberEntryCompleted = () =>
1515
{
16-
if (this.TopupAmountEntry.IsReadOnly)
16+
if (this.TopupAmountEntry.IsReadOnly == false)
1717
{
1818
this.TopupAmountEntry.Focus();
1919
}

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherIssueFailedPage.xaml

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,24 @@
22
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
33
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
44
x:Class="TransactionMobile.Maui.VoucherIssueFailedPage"
5-
Title="{Binding Title}"
5+
Shell.NavBarIsVisible="False"
66
BackgroundColor="White">
7-
<StackLayout>
8-
<Label
9-
Margin="0,40,0,0"
10-
Style="{StaticResource LabelStyle}"
11-
HorizontalTextAlignment="Center"
12-
AutomationId="VoucherIssueFailed"
13-
Text="VOUCHER ISSUE FAILURE" />
7+
<VerticalStackLayout x:Name="MainLayout">
8+
<Label Text="{Binding Title}" FontSize="24" HorizontalOptions="Center" VerticalOptions="End"
9+
FontAttributes="Bold" Padding="20,0,0,20"/>
10+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand" CornerRadius="20"
11+
Opacity="0.9" BackgroundColor="#E5E9F0">
12+
<VerticalStackLayout Spacing="10">
1413

15-
<Button
16-
x:Name="CancelButton"
17-
Grid.Row="5"
18-
Margin="0,16"
19-
MinimumWidthRequest="250"
20-
WidthRequest="400"
21-
Text="Cancel"
22-
Command="{Binding CancelledCommand}"
23-
AutomationId="CancelButton"/>
24-
</StackLayout>
14+
<Image Source="Resources/PaymentFailure.svg" VerticalOptions="Start" Aspect="AspectFit"/>
15+
16+
<Label Margin="17,8"
17+
Text="Unfortunately, we could not process your voucher issue, this may be for a variety of reasons. If you wish you can retry the transaction."/>
18+
19+
<Button x:Name="CancelButton" Grid.Row="5" Margin="0,16"
20+
Text="Cancel" Command="{Binding CancelledCommand}"
21+
Style="{DynamicResource VoucherButtonStyle}" AutomationId="CancelButton"/>
22+
</VerticalStackLayout>
23+
</Frame>
24+
</VerticalStackLayout>
2525
</ContentPage>

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherIssueSuccessPage.xaml

Lines changed: 17 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,24 @@
22
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
33
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
44
x:Class="TransactionMobile.Maui.VoucherIssueSuccessPage"
5-
Title="{Binding Title}"
5+
Shell.NavBarIsVisible="False"
66
BackgroundColor="White">
7-
<StackLayout>
8-
<Label
9-
Margin="0,40,0,0"
10-
Style="{StaticResource LabelStyle}"
11-
HorizontalTextAlignment="Center"
12-
AutomationId="VoucherIssueSuccessful"
13-
Text="VOUCHER ISSUE SUCCESSFUL" />
7+
<VerticalStackLayout x:Name="MainLayout">
8+
<Label Text="{Binding Title}" FontSize="24" HorizontalOptions="Center" VerticalOptions="End"
9+
FontAttributes="Bold" Padding="20,0,0,20"/>
10+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand" CornerRadius="20"
11+
Opacity="0.9" BackgroundColor="#E5E9F0">
12+
<VerticalStackLayout Spacing="10">
1413

15-
<!-- Payment description label -->
16-
<Label
17-
Margin="17,8"
18-
Text="Thank you for your voucher. An automated payment receipt will be sent to your email entered." />
14+
<Image Source="Resources/PaymentSuccess.svg" VerticalOptions="Start" Aspect="AspectFit"/>
1915

20-
<Button
21-
x:Name="CompleteButton"
22-
Margin="0,16"
23-
MinimumWidthRequest="250"
24-
WidthRequest="250"
25-
Text="Complete"
26-
Command="{Binding CompletedCommand}"
27-
AutomationId="CompleteButton"/>
28-
</StackLayout>
16+
<!-- Payment description label -->
17+
<Label Margin="17,8"
18+
Text="Thank you for your voucher purchase. An automated payment receipt will be sent to your email entered."/>
19+
20+
<Button x:Name="CompleteButton" Margin="0,16" Text="Complete" Command="{Binding CompletedCommand}"
21+
Style="{DynamicResource VoucherButtonStyle}" AutomationId="CompleteButton"/>
22+
</VerticalStackLayout>
23+
</Frame>
24+
</VerticalStackLayout>
2925
</ContentPage>

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherPerformIssuePage.xaml

Lines changed: 37 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,58 +4,71 @@
44
x:Class="TransactionMobile.Maui.VoucherPerformIssuePage"
55
xmlns:behaviors="clr-namespace:CommunityToolkit.Maui.Behaviors;assembly=CommunityToolkit.Maui"
66
Title="{Binding Title}"
7+
Shell.NavBarIsVisible="False"
78
BackgroundColor="White">
8-
<StackLayout>
9-
<Entry x:Name="RecipientMobileNumberEntry"
9+
<VerticalStackLayout x:Name="MainLayout">
10+
<Label Text="{Binding Title}" FontSize="24" HorizontalOptions="Center" VerticalOptions="End" FontAttributes="Bold" Padding="20,0,0,20"/>
11+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand"
12+
CornerRadius="20" Opacity="0.9" BackgroundColor="#E5E9F0">
13+
<VerticalStackLayout Spacing="10">
14+
<Entry x:Name="RecipientMobileNumberEntry"
1015
Placeholder="Recipient Mobile Number"
1116
AutomationId="RecipientMobileNumberEntry"
17+
Style="{DynamicResource MobileNumberEntryStyle}"
1218
Text="{Binding RecipientMobileNumber}"
1319
Keyboard="Numeric">
14-
<Entry.Behaviors>
15-
<behaviors:EventToCommandBehavior
20+
<Entry.Behaviors>
21+
<behaviors:EventToCommandBehavior
1622
EventName="Completed"
1723
Command="{Binding RecipientMobileNumberEntryCompletedCommand}" />
18-
</Entry.Behaviors>
19-
</Entry>
24+
</Entry.Behaviors>
25+
</Entry>
2026

21-
<Entry x:Name="RecipientEmailAddressEntry"
27+
<Entry x:Name="RecipientEmailAddressEntry"
2228
Placeholder="Recipient Email Address"
2329
AutomationId="RecipientEmailAddressEntry"
30+
Style="{DynamicResource EmailAddressEntryStyle}"
2431
Text="{Binding RecipientEmailAddress}"
2532
Keyboard="Numeric">
26-
<Entry.Behaviors>
27-
<behaviors:EventToCommandBehavior
33+
<Entry.Behaviors>
34+
<behaviors:EventToCommandBehavior
2835
EventName="Completed"
2936
Command="{Binding RecipientEmailAddressEntryCompletedCommand}" />
30-
</Entry.Behaviors>
31-
</Entry>
37+
</Entry.Behaviors>
38+
</Entry>
3239

33-
<Entry x:Name="VoucherAmountEntry"
40+
<Entry x:Name="VoucherAmountEntry"
3441
Placeholder="100"
3542
AutomationId="VoucherAmountEntry"
43+
Style="{DynamicResource AmountEntryStyle}"
3644
Text="{Binding VoucherAmount}"
3745
Keyboard="Numeric">
38-
<Entry.Behaviors>
39-
<behaviors:EventToCommandBehavior
46+
<Entry.Behaviors>
47+
<behaviors:EventToCommandBehavior
4048
EventName="Completed"
4149
Command="{Binding VoucherAmountEntryCompletedCommand}" />
42-
</Entry.Behaviors>
43-
</Entry>
44-
45-
<Entry x:Name="CustomerEmailAddressEntry"
50+
</Entry.Behaviors>
51+
</Entry>
52+
53+
<Entry x:Name="CustomerEmailAddressEntry"
4654
Placeholder="customeremail@email.com"
4755
AutomationId="CustomerEmailAddressEntry"
56+
Style="{DynamicResource EmailAddressEntryStyle}"
4857
Text="{Binding CustomerEmailAddress}">
49-
<Entry.Behaviors>
50-
<behaviors:EventToCommandBehavior
58+
<Entry.Behaviors>
59+
<behaviors:EventToCommandBehavior
5160
EventName="Completed"
5261
Command="{Binding CustomerEmailAddressEntryCompletedCommand}" />
53-
</Entry.Behaviors>
54-
</Entry>
62+
</Entry.Behaviors>
63+
</Entry>
5564

56-
<Button x:Name="IssueVoucherButton"
65+
<Button x:Name="IssueVoucherButton"
5766
Text="Issue Voucher"
5867
Command="{Binding IssueVoucherCommand}"
68+
Style="{DynamicResource VoucherButtonStyle}"
5969
AutomationId="IssueVoucherButton"/>
60-
</StackLayout>
70+
</VerticalStackLayout>
71+
</Frame>
72+
</VerticalStackLayout>
73+
6174
</ContentPage>

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherPerformIssuePage.xaml.cs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ public VoucherPerformIssuePage(VoucherPerformIssuePageViewModel vm)
1313
BindingContext = vm;
1414
vm.OnRecipientMobileNumberEntryCompleted = () =>
1515
{
16-
if (this.VoucherAmountEntry.IsEnabled)
16+
if (this.VoucherAmountEntry.IsReadOnly == false)
1717
{
1818
this.VoucherAmountEntry.Focus();
1919
}
@@ -48,7 +48,7 @@ protected override async void OnAppearing()
4848
base.OnAppearing();
4949
if (viewModel.VoucherAmount > 0)
5050
{
51-
this.VoucherAmountEntry.IsEnabled = false;
51+
this.VoucherAmountEntry.IsReadOnly = true;
5252
}
5353
}
5454

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherSelectOperatorPage.xaml

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,15 @@
22
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
33
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
44
x:Class="TransactionMobile.Maui.VoucherSelectOperatorPage"
5-
Title="{Binding Title}"
5+
Shell.NavBarIsVisible="False"
66
BackgroundColor="White">
7-
<StackLayout>
8-
<Grid x:Name="OperatorGrid" HorizontalOptions="CenterAndExpand" VerticalOptions="FillAndExpand">
9-
</Grid>
10-
</StackLayout>
7+
<VerticalStackLayout x:Name="MainLayout">
8+
<Label Text="{Binding Title}" FontSize="24" HorizontalOptions="Center" VerticalOptions="End"
9+
FontAttributes="Bold" Padding="20,0,0,20"/>
10+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand" CornerRadius="20"
11+
Opacity="0.9" BackgroundColor="#E5E9F0">
12+
<VerticalStackLayout Spacing="10" x:Name="OperatorList">
13+
</VerticalStackLayout>
14+
</Frame>
15+
</VerticalStackLayout>
1116
</ContentPage>

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherSelectOperatorPage.xaml.cs

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -22,17 +22,8 @@ protected override async void OnAppearing()
2222

2323
private void LoadOperators(VoucherSelectOperatorPageViewModel viewModel)
2424
{
25-
RowDefinitionCollection rowDefinitionCollection = new RowDefinitionCollection();
26-
for (Int32 i = 0; i < viewModel.Operators.Count; i++)
27-
{
28-
rowDefinitionCollection.Add(new RowDefinition
29-
{
30-
Height = 60
31-
});
32-
}
33-
34-
this.OperatorGrid.RowDefinitions = rowDefinitionCollection;
35-
25+
this.OperatorList.Children.Clear();
26+
3627
Int32 rowCount = 0;
3728
foreach (ContractOperatorModel modelOperator in viewModel.Operators)
3829
{
@@ -42,7 +33,7 @@ private void LoadOperators(VoucherSelectOperatorPageViewModel viewModel)
4233
HorizontalOptions = LayoutOptions.FillAndExpand,
4334
AutomationId = modelOperator.OperatorName,
4435
};
45-
//button.SetDynamicResource(VisualElement.StyleProperty, "MobileTopupButtonStyle");
36+
button.SetDynamicResource(VisualElement.StyleProperty, "VoucherButtonStyle");
4637
Binding commandParameter = new Binding()
4738
{
4839
Source = new ItemSelected<ContractOperatorModel>(){
@@ -59,7 +50,7 @@ private void LoadOperators(VoucherSelectOperatorPageViewModel viewModel)
5950
button.SetBinding(Button.CommandProperty, command);
6051
button.SetBinding(Button.CommandParameterProperty, commandParameter);
6152

62-
this.OperatorGrid.Add(button, 0, rowCount);
53+
this.OperatorList.Add(button);
6354

6455
rowCount++;
6556
}

TransactionMobile.Maui/Pages/Transactions/Voucher/VoucherSelectProductPage.xaml

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,15 @@
22
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
33
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
44
x:Class="TransactionMobile.Maui.VoucherSelectProductPage"
5-
Title="{Binding Title}"
5+
Shell.NavBarIsVisible="False"
66
BackgroundColor="White">
7-
<StackLayout>
8-
<Grid x:Name="ProductsGrid" HorizontalOptions="CenterAndExpand" VerticalOptions="FillAndExpand">
9-
</Grid>
10-
</StackLayout>
7+
<VerticalStackLayout x:Name="MainLayout">
8+
<Label Text="{Binding Title}" FontSize="24" HorizontalOptions="Center" VerticalOptions="End"
9+
FontAttributes="Bold" Padding="20,0,0,20"/>
10+
<Frame HasShadow="True" Padding="25,50" Margin="10,0,10,10" VerticalOptions="CenterAndExpand" CornerRadius="20"
11+
Opacity="0.9" BackgroundColor="#E5E9F0">
12+
<VerticalStackLayout Spacing="10" x:Name="ProductsList">
13+
</VerticalStackLayout>
14+
</Frame>
15+
</VerticalStackLayout>
1116
</ContentPage>

0 commit comments

Comments
 (0)