Skip to content

Commit 8ab977d

Browse files
justcoding121justcoding121
committed
Add touch effect to list items
1 parent 82d25fe commit 8ab977d

38 files changed

+1107
-885
lines changed

‎src/Bible.Alarm/Services/UI/FontService.cs‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ public sealed class FontService : IFontService, INotifyPropertyChanged, IDisposa
1919
private double headerFontSize;
2020
private double buttonFontSize;
2121
private double smallFontSize;
22+
private double smallMediumFontSize;
2223
private double mediumFontSize;
2324
private double largeFontSize;
2425
private double titleFontSize;
@@ -108,6 +109,7 @@ private void SetWindowsDesktopFallbackFontSizes(double androidAlarmReduction)
108109
standardFontSize = 14.0 * accessibilityScale;
109110
headerFontSize = 20.0 * accessibilityScale;
110111
smallFontSize = 12.0 * accessibilityScale;
112+
smallMediumFontSize = 12.0 * accessibilityScale;
111113
mediumFontSize = 16.0 * accessibilityScale;
112114
largeFontSize = 18.0 * accessibilityScale;
113115
titleFontSize = 22.0 * accessibilityScale;
@@ -138,13 +140,15 @@ private void SetOtherPlatformFallbackFontSizes(bool isAndroid, double androidAla
138140
const double BaseStandardSize = 12.0;
139141
const double BaseHeaderSize = 18.0;
140142
const double BaseSmallSize = 10.0;
143+
const double BaseSmallMediumSize = 12.0;
141144
const double BaseMediumSize = 14.0;
142145
const double BaseLargeSize = 16.0;
143146
const double BaseTitleSize = 20.0;
144147

145148
standardFontSize = BaseStandardSize * accessibilityScale;
146149
headerFontSize = BaseHeaderSize * accessibilityScale;
147150
smallFontSize = BaseSmallSize * accessibilityScale;
151+
smallMediumFontSize = BaseSmallMediumSize * accessibilityScale;
148152
mediumFontSize = BaseMediumSize * accessibilityScale;
149153
largeFontSize = BaseLargeSize * accessibilityScale;
150154
titleFontSize = BaseTitleSize * accessibilityScale;
@@ -205,6 +209,7 @@ private void SetStandardFontSizes(double densityScale, double accessibilityScale
205209
const double BaseStandardSize = 12.0;
206210
const double BaseHeaderSize = 18.0;
207211
const double BaseSmallSize = 10.0;
212+
const double BaseSmallMediumSize = 12.0;
208213
const double BaseMediumSize = 14.0;
209214
const double BaseLargeSize = 16.0;
210215
const double BaseTitleSize = 20.0;
@@ -221,6 +226,7 @@ private void SetStandardFontSizes(double densityScale, double accessibilityScale
221226
standardFontSize = Math.Min(BaseStandardSize * densityScale * accessibilityScale, 17.0 * accessibilityCap);
222227
headerFontSize = Math.Min(BaseHeaderSize * densityScale * accessibilityScale, 26.0 * accessibilityCap);
223228
smallFontSize = Math.Min(BaseSmallSize * densityScale * accessibilityScale, 14.0 * accessibilityCap);
229+
smallMediumFontSize = Math.Min(BaseSmallMediumSize * densityScale * accessibilityScale, 16.0 * accessibilityCap);
224230
mediumFontSize = Math.Min(BaseMediumSize * densityScale * accessibilityScale, 19.0 * accessibilityCap);
225231
largeFontSize = Math.Min(BaseLargeSize * densityScale * accessibilityScale, 22.0 * accessibilityCap);
226232
titleFontSize = Math.Min(BaseTitleSize * densityScale * accessibilityScale, 30.0 * accessibilityCap);
@@ -299,6 +305,7 @@ public void Dispose()
299305
public double HeaderFontSize => headerFontSize;
300306
public double ButtonFontSize => buttonFontSize;
301307
public double SmallFontSize => smallFontSize;
308+
public double SmallMediumFontSize => smallMediumFontSize;
302309
public double MediumFontSize => mediumFontSize;
303310
public double LargeFontSize => largeFontSize;
304311
public double TitleFontSize => titleFontSize;

‎src/Bible.Alarm/Services/UI/FontServiceHelper.cs‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,12 @@ internal static IFontService GetFontService()
8484
/// </summary>
8585
public static double SmallFontSize => GetFontService().SmallFontSize;
8686

87+
/// <summary>
88+
/// Gets the small-medium font size (12pt scaled by density)
89+
/// Hot-reload friendly: Always returns a valid value
90+
/// </summary>
91+
public static double SmallMediumFontSize => GetFontService().SmallMediumFontSize;
92+
8793
/// <summary>
8894
/// Gets the medium font size (14pt scaled by density)
8995
/// Hot-reload friendly: Always returns a valid value

‎src/Bible.Alarm/Services/UI/Interfaces/IFontService.cs‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@ public interface IFontService : IDisposable
2525
/// </summary>
2626
double SmallFontSize { get; }
2727

28+
/// <summary>
29+
/// Small-medium font size (12 points) scaled by device density and OS accessibility settings
30+
/// </summary>
31+
double SmallMediumFontSize { get; }
32+
2833
/// <summary>
2934
/// Medium font size (14 points) scaled by device density and OS accessibility settings
3035
/// </summary>

‎src/Bible.Alarm/Views/BiblePublications/BiblePublicationSelection.xaml‎

Lines changed: 57 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
xmlns:shared="clr-namespace:Bible.Alarm.ViewModels.Shared"
1515
xmlns:services="clr-namespace:Bible.Alarm.Services.UI;assembly=Bible.Alarm"
1616
xmlns:system="clr-namespace:System;assembly=System.Runtime"
17+
xmlns:core="clr-namespace:Syncfusion.Maui.Core;assembly=Syncfusion.Maui.Core"
1718
x:DataType="bible:BiblePublicationSelectionViewModel"
1819
Title="Select Publication"
1920
BackgroundColor="{DynamicResource BackgroundColor}">
@@ -51,53 +52,62 @@
5152
<CollectionView.ItemTemplate>
5253
<DataTemplate x:DataType="shared:PublicationListViewItemModel">
5354
<Grid Margin="16,0">
54-
<Border
55-
BackgroundColor="{DynamicResource CardBackgroundColor}"
56-
StrokeThickness="0"
57-
Padding="0">
58-
<Border.Style>
59-
<Style TargetType="Border">
60-
<Style.Triggers>
61-
<DataTrigger TargetType="Border" Binding="{Binding IsSelected}" Value="True">
62-
<Setter Property="BackgroundColor" Value="{DynamicResource SelectedItemBackgroundColor}" />
63-
</DataTrigger>
64-
</Style.Triggers>
65-
</Style>
66-
</Border.Style>
67-
<Border.StrokeShape>
68-
<RoundRectangle CornerRadius="12" />
69-
</Border.StrokeShape>
70-
<Border.Shadow>
71-
<Shadow Brush="{AppThemeBinding Light=#E0E0E0, Dark=#000000}"
72-
Offset="0,2"
73-
Opacity="0.08"
74-
Radius="4" />
75-
</Border.Shadow>
76-
<Grid
77-
Padding="20,18"
78-
ColumnSpacing="12"
79-
MinimumHeightRequest="56"
80-
BackgroundColor="Transparent">
81-
<Grid.GestureRecognizers>
82-
<TapGestureRecognizer Tapped="OnPublicationItemTapped" />
83-
</Grid.GestureRecognizers>
84-
<Grid.ColumnDefinitions>
85-
<ColumnDefinition Width="*" />
86-
</Grid.ColumnDefinitions>
87-
88-
<!-- Bible Publication Name -->
89-
<Label
90-
Grid.Column="0"
91-
FontSize="{DynamicResource LargeFontSize}"
92-
HorizontalOptions="Fill"
93-
HorizontalTextAlignment="Start"
94-
LineBreakMode="WordWrap"
95-
Text="{Binding Name}"
96-
TextColor="{DynamicResource TextPrimaryColor}"
97-
VerticalOptions="Center"
98-
VerticalTextAlignment="Center" />
99-
</Grid>
100-
</Border>
55+
<core:SfEffectsView
56+
TouchDownEffects="{OnPlatform Android=Ripple, iOS=Highlight, Default=Ripple}"
57+
TouchUpEffects="None"
58+
RippleBackground="{StaticResource PrimaryColor}"
59+
HighlightBackground="{StaticResource PrimaryLightColor}"
60+
RippleAnimationDuration="200"
61+
ShouldIgnoreTouches="False">
62+
<core:SfEffectsView.GestureRecognizers>
63+
<TapGestureRecognizer Tapped="OnPublicationItemTapped" />
64+
</core:SfEffectsView.GestureRecognizers>
65+
<Border
66+
BackgroundColor="{DynamicResource CardBackgroundColor}"
67+
StrokeThickness="0"
68+
Padding="0">
69+
<Border.Style>
70+
<Style TargetType="Border">
71+
<Style.Triggers>
72+
<DataTrigger TargetType="Border" Binding="{Binding IsSelected}" Value="True">
73+
<Setter Property="BackgroundColor" Value="{DynamicResource SelectedItemBackgroundColor}" />
74+
</DataTrigger>
75+
</Style.Triggers>
76+
</Style>
77+
</Border.Style>
78+
<Border.StrokeShape>
79+
<RoundRectangle CornerRadius="12" />
80+
</Border.StrokeShape>
81+
<Border.Shadow>
82+
<Shadow Brush="{AppThemeBinding Light=#E0E0E0, Dark=#000000}"
83+
Offset="0,2"
84+
Opacity="0.08"
85+
Radius="4" />
86+
</Border.Shadow>
87+
<Grid
88+
Padding="20,18"
89+
ColumnSpacing="12"
90+
MinimumHeightRequest="56"
91+
BackgroundColor="Transparent">
92+
<Grid.ColumnDefinitions>
93+
<ColumnDefinition Width="*" />
94+
</Grid.ColumnDefinitions>
95+
96+
<!-- Bible Publication Name -->
97+
<Label
98+
Grid.Column="0"
99+
FontSize="{DynamicResource LargeFontSize}"
100+
HorizontalOptions="Fill"
101+
HorizontalTextAlignment="Start"
102+
InputTransparent="True"
103+
LineBreakMode="WordWrap"
104+
Text="{Binding Name}"
105+
TextColor="{DynamicResource TextPrimaryColor}"
106+
VerticalOptions="Center"
107+
VerticalTextAlignment="Center" />
108+
</Grid>
109+
</Border>
110+
</core:SfEffectsView>
101111
</Grid>
102112
</DataTemplate>
103113
</CollectionView.ItemTemplate>

‎src/Bible.Alarm/Views/BiblePublications/BiblePublicationSelection.xaml.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ public void Dispose()
8080

8181
private async void OnPublicationItemTapped(object? sender, TappedEventArgs e)
8282
{
83-
if (sender is Grid grid && grid.BindingContext is PublicationListViewItemModel publicationItem)
83+
if (sender is View view && view.BindingContext is PublicationListViewItemModel publicationItem)
8484
{
8585
if (ViewModel != null && ViewModel.SectionSelectionCommand is IAsyncRelayCommand<PublicationListViewItemModel> asyncCommand)
8686
{

0 commit comments

Comments
 (0)