Skip to content

Commit cf19b08

Browse files
committed
Refactor iOS large titles sample and remove legacy page
Replaces the old LargeTitlesPageiOS.cs with an enhanced iOSLargeTitlePage.xaml.cs implementation, providing improved UI and more comprehensive large title and navigation bar demonstrations. Removes the legacy page from OthersViewModel and updates the sample to use the new, feature-rich version. Refactor iOS large titles sample and remove legacy page Replaces the old LargeTitlesPageiOS.cs with an enhanced iOSLargeTitlePage.xaml.cs implementation, providing improved UI and more comprehensive large title and navigation bar demonstrations. Removes the legacy page from OthersViewModel and updates the sample to use the new, feature-rich version. Apply suggestions from code review
1 parent a7ecebe commit cf19b08

5 files changed

Lines changed: 228 additions & 142 deletions

File tree

src/Controls/samples/Controls.Sample/Pages/Others/LargeTitlesPageiOS.cs

Lines changed: 0 additions & 90 deletions
This file was deleted.
Lines changed: 228 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,228 @@
1+
using System;
2+
using System.Linq;
3+
using Microsoft.Maui;
4+
using Microsoft.Maui.Controls;
5+
using Microsoft.Maui.Controls.PlatformConfiguration;
6+
using Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;
7+
using Microsoft.Maui.Graphics;
8+
9+
namespace Maui.Controls.Sample.Pages;
10+
11+
public partial class iOSLargeTitlePage : ContentPage
12+
{
13+
public iOSLargeTitlePage()
14+
{
15+
Title = "Large Titles";
16+
17+
// Set the parent NavigationPage's BarTextColor to black when this page appears
18+
Appearing += (s, e) =>
19+
{
20+
if (Parent is Microsoft.Maui.Controls.NavigationPage navPage)
21+
{
22+
navPage.BarTextColor = Colors.Black;
23+
}
24+
};
25+
26+
var scrollView = new Microsoft.Maui.Controls.ScrollView
27+
{
28+
Content = new StackLayout
29+
{
30+
Padding = new Thickness(10),
31+
Spacing = 15,
32+
Children =
33+
{
34+
// Display Mode Section
35+
new Label
36+
{
37+
Text = "Display Mode",
38+
FontSize = 20,
39+
FontAttributes = FontAttributes.Bold,
40+
Margin = new Thickness(0, 10, 0, 0)
41+
},
42+
new Button
43+
{
44+
Text = "Never - Hide large title",
45+
Command = new Command(() => On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never))
46+
},
47+
new Button
48+
{
49+
Text = "Always - Show large title",
50+
Command = new Command(() => On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Always))
51+
},
52+
new Button
53+
{
54+
Text = "Automatic - Inherit from previous page",
55+
Command = new Command(async () =>
56+
{
57+
var page = new ContentPage { Title = "Automatic Mode" };
58+
page.On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Automatic);
59+
await Navigation.PushAsync(page);
60+
})
61+
},
62+
63+
// Navigation Configuration Section
64+
new BoxView { HeightRequest = 1, Color = Colors.Gray, Margin = new Thickness(0, 10) },
65+
new Label
66+
{
67+
Text = "Navigation Configuration",
68+
FontSize = 20,
69+
FontAttributes = FontAttributes.Bold
70+
},
71+
new Button
72+
{
73+
Text = "Toggle PrefersLargeTitles on NavigationPage",
74+
Command = new Command(async () =>
75+
{
76+
var navPage = (Microsoft.Maui.Controls.NavigationPage)Parent;
77+
navPage.On<iOS>().SetPrefersLargeTitles(!navPage.On<iOS>().PrefersLargeTitles());
78+
79+
// Refresh the page to show the change
80+
Navigation.InsertPageBefore(new iOSLargeTitlePage(), this);
81+
await Navigation.PopAsync(false);
82+
})
83+
},
84+
85+
// Scrolling Behavior Section
86+
new BoxView { HeightRequest = 1, Color = Colors.Gray, Margin = new Thickness(0, 10) },
87+
new Label
88+
{
89+
Text = "Scrolling Behavior",
90+
FontSize = 20,
91+
FontAttributes = FontAttributes.Bold
92+
},
93+
new Button
94+
{
95+
Text = "ScrollView - Watch title collapse on scroll",
96+
Command = new Command(async () =>
97+
{
98+
var navPage = (Microsoft.Maui.Controls.NavigationPage)Parent;
99+
navPage.On<iOS>().SetPrefersLargeTitles(true);
100+
101+
var page = new ContentPage { Title = "Scroll Me" };
102+
page.On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Always);
103+
104+
var scrollContent = new StackLayout { Padding = 20, Spacing = 10 };
105+
for (int i = 1; i <= 50; i++)
106+
{
107+
scrollContent.Children.Add(new Label
108+
{
109+
Text = $"Item {i} - Scroll to see the large title collapse",
110+
FontSize = 16,
111+
Padding = new Thickness(0, 10)
112+
});
113+
}
114+
115+
page.Content = new Microsoft.Maui.Controls.ScrollView { Content = scrollContent };
116+
await Navigation.PushAsync(page);
117+
})
118+
},
119+
new Button
120+
{
121+
Text = "CollectionView - Large title with SafeArea",
122+
Command = new Command(async () =>
123+
{
124+
var navPage = (Microsoft.Maui.Controls.NavigationPage)Parent;
125+
navPage.On<iOS>().SetPrefersLargeTitles(true);
126+
127+
var page = new ContentPage { Title = "CollectionView Demo", BackgroundColor = Colors.LightBlue };
128+
page.On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Always);
129+
page.SafeAreaEdges = Microsoft.Maui.SafeAreaEdges.All;
130+
131+
var collectionView = new Microsoft.Maui.Controls.CollectionView
132+
{
133+
VerticalOptions = LayoutOptions.Fill
134+
};
135+
136+
collectionView.ItemTemplate = new DataTemplate(() =>
137+
{
138+
var label = new Label
139+
{
140+
Text = "Scroll to see title collapse",
141+
FontSize = 18,
142+
Padding = 15
143+
};
144+
return label;
145+
});
146+
147+
collectionView.ItemsSource = Enumerable.Range(1, 40);
148+
collectionView.Header = new Label { BackgroundColor = Colors.Pink, Text = "Header", Padding = 10, FontSize = 16 };
149+
collectionView.Footer = new Label { BackgroundColor = Colors.Yellow, Text = "Footer", Padding = 10, FontSize = 16 };
150+
151+
page.Content = collectionView;
152+
await navPage.PushAsync(page);
153+
})
154+
},
155+
new Button
156+
{
157+
Text = "Transparent NavBar - Content shows through",
158+
Command = new Command(async () =>
159+
{
160+
var navPage = (Microsoft.Maui.Controls.NavigationPage)Parent;
161+
navPage.On<iOS>().SetPrefersLargeTitles(true);
162+
var previousBarColor = navPage.BarBackgroundColor;
163+
navPage.BarBackgroundColor = Colors.Transparent;
164+
165+
var page = new ContentPage
166+
{
167+
Title = "Transparent Bar",
168+
// Create a gradient background that shows through the nav bar
169+
Background = new LinearGradientBrush
170+
{
171+
StartPoint = new Point(0, 0),
172+
EndPoint = new Point(0, 1),
173+
GradientStops = new GradientStopCollection
174+
{
175+
new GradientStop { Color = Color.FromArgb("#667eea"), Offset = 0.0f },
176+
new GradientStop { Color = Color.FromArgb("#764ba2"), Offset = 1.0f }
177+
}
178+
}
179+
};
180+
page.On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Always);
181+
182+
var scrollContent = new StackLayout { Padding = 20, Spacing = 15 };
183+
scrollContent.Children.Add(new Label
184+
{
185+
Text = "Notice how the gradient background shows through the navigation bar area. This follows Apple's HIG recommendation.",
186+
FontSize = 16,
187+
TextColor = Colors.White,
188+
Margin = new Thickness(0, 20)
189+
});
190+
191+
for (int i = 1; i <= 30; i++)
192+
{
193+
scrollContent.Children.Add(new Frame
194+
{
195+
BackgroundColor = Colors.White.WithAlpha(0.9f),
196+
CornerRadius = 10,
197+
Padding = 15,
198+
Content = new Label
199+
{
200+
Text = $"Card {i} - Scroll to see the effect",
201+
FontSize = 16
202+
}
203+
});
204+
}
205+
206+
page.Content = new Microsoft.Maui.Controls.ScrollView { Content = scrollContent };
207+
await Navigation.PushAsync(page);
208+
209+
// Restore opaque background when returning
210+
page.Disappearing += (s, e) => navPage.BarBackgroundColor = previousBarColor;
211+
})
212+
},
213+
214+
// Back Button
215+
new BoxView { HeightRequest = 1, Color = Colors.Gray, Margin = new Thickness(0, 10) },
216+
new Button
217+
{
218+
Text = "← Back To Gallery",
219+
Margin = new Thickness(0, 10, 0, 20),
220+
Command = new Command(async () => await Navigation.PopAsync())
221+
}
222+
}
223+
}
224+
};
225+
226+
Content = scrollView;
227+
}
228+
}

src/Controls/samples/Controls.Sample/Pages/PlatformSpecifics/iOS/iOSLargeTitlePage.xaml

Lines changed: 0 additions & 12 deletions
This file was deleted.

src/Controls/samples/Controls.Sample/Pages/PlatformSpecifics/iOS/iOSLargeTitlePage.xaml.cs

Lines changed: 0 additions & 37 deletions
This file was deleted.

src/Controls/samples/Controls.Sample/ViewModels/OthersViewModel.cs

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,6 @@ protected override IEnumerable<SectionModel> CreateItems() => new[]
1212
new SectionModel(typeof(GraphicsViewPage), "GraphicsView",
1313
"Allow to draw directly in a Canvas. You can combine a canvas and native Views on the same page."),
1414

15-
new SectionModel(typeof(LargeTitlesPageiOS), "Large Titles - iOS",
16-
"This iOS platform-specific is used to display the page title as a large title on the navigation bar of a NavigationPage, for devices that use iOS 11 or greater."),
17-
1815
new SectionModel(typeof(StyleSheetsPage), "StyleSheets",
1916
"Demonstrates the usage of CSS in XAML."),
2017

0 commit comments

Comments
 (0)