Page 52 - MSDN Magazine, September 2018
P. 52
using (var reader =
new StringReader
("^contentpage { background-color: lightgray; } stacklayout { margin: 20; }"))
{
this.Resources.Add(StyleSheet.FromReader(reader)); }
You could even load a .css file at runtime using the following snippet, where Page1 represents a page in the application and Project1 represents your project name:
this.Resources.Add(StyleSheet.FromAssemblyResource( IntrospectionExtensions.GetTypeInfo(typeof(Page1)).Assembly, "Project1.Assets.mystyle.css"));
Another extremely useful addition to Xamarin.Forms is the Visual State Manager (bit.ly/2NVH4AS), which you might already know if you have experience with WPF and UWP. With it, you can make changes to the UI you declared in XAML, based on a view’s state. For example, you can use the Visual State Manager to change the color of a view depending on its state, as shown in the code snippet in Figure 5.
With the markup in Figure 5, the Entry will automatically change its background color when its state changes. In this case, you need to set the Entry’s IsEnabled property as False to disable the view and trigger the Disabled state. States must be grouped into objects called VisualStateGroup. Each state is represented by the VisualState object, where you add Setter specifications as you would do with styles, there- fore providing the name of the property you want to change and its value. Of course, you can specify multiple property setters.
Xamarin.Forms defines a set of states called common states, such as Normal, Focused and Disabled (see the VisualStateGroup with the CommonState name above); these states are common to each view. Other states might be available only to specific views and not to others. The Visual State Manager provides an elegant and clean way to control the UI behavior, all in your XAML code.
Xamarin.Forms 3.0 also makes it easy to implement right-to-left localization. The Device class now exposes the FlowDirection property, which reads this localization information from the device. You can then assign its value to the FlowDirection property of a view as follows:
<ContentPage FlowDirection="{x:Static Device.FlowDirection}">
Of course you can also bind the FlowDirection property of a view in XAML, making sure your view model exposes a property that returns the value of Device.FlowDirection. Just a few weeks after the release of
Figure 5 Changing Background Color
Xamarin.Forms 3.0, Microsoft published version 3.1, which provides bug fixes and introduces many improvements to performance, reli- ability and visual elements. For instance, the SelectionMode property is now available in the ListView control, which can be used as follows:
<ListView SelectionMode="None"> ...
</ListView>
Possible values are None and Single. This is an important improvement, because previous versions required that you manually write code to disable an item selection or create a custom renderer for the ListView. The Switch control also now supports specifying a different color when the selector is turned on, which you can do with the OnColor property of type Color, like so:
<Switch OnColor="Blue"/>
Before Xamarin.Forms 3.1, you had to write a custom renderer to get this result. Similarly, the Slider control allows specifying colors through the ThumbColor, MaximumTrackColor and MinimumTrackColor properties. Other additions are the IsSpellCheckEnabled property for Entry and Editor views, and the control over text-prediction and APIs that allow you to control the shadow over views in iOS.
The addition of bindable spans is worth taking a moment to explore, given this feature had been requested many times by the developer community. Put succinctly, the Span class, which you use for more sophisticated string formatting, now inherits from BindableObject, so that all the properties related to text formatting support data binding. A new bindable property called Style has been introduced, so you can use XAML styles defined in the app resources. The following XAML snippet provides an example:
<Label> <Label.FormattedText>
<FormattedString> <FormattedString.Spans>
<Span Text="{Binding TitleText}" Style="{StaticResource TitleStyle}" /> <Span Text="{Binding SubtitleText}" Style="{StaticResource SubTitleStyle}" /> <Span Text="{Binding SomeText}" Style="{StaticResource NormalStyle}" />
</FormattedString.Spans> </FormattedString>
</Label.FormattedText> </Label>
You can find a full list of available additions in Xamarin.Forms 3.1 in the release notes page at bit.ly/2NkVA3T.
Wrapping Up
Xamarin is continuously advancing, not only to support evolving platforms and OSes, but to increase the quality and productivity of the development tools. In this article I’ve explored a huge num- ber of new and updated features that solve many problems, from the code editor and integrated tools to platform and CSS support. More is yet to come as additional updates are released. It’s a good idea to regularly check the Xamarin blog (blog.xamarin.com) to stay up-to-date with the latest news and announcements. n
AlessAndro del sole has been a Microsoft MVP since 2008 and a Xamarin Certified Developer. He has authored many books, eBooks, instructional videos and articles about .NET development with Visual Studio. Del Sole works for Fresenius Medical Care as a senior software engineer, focusing on building .NET and mobile apps in the health care market. You can follow him on Twitter: @progalex.
ThAnks to the following Microsoft technical experts who reviewed this article: David Britch, Amy Burns
<Entry> <VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="White" />
</VisualState.Setters> </VisualState>
<VisualState x:Name="Focused"> <VisualState.Setters>
<Setter Property="BackgroundColor" Value="LightGray" /> </VisualState.Setters>
</VisualState>
<VisualState x:Name="Disabled"> <VisualState.Setters>
<Setter Property="BackgroundColor" Value="Gray" /> </VisualState.Setters>
</VisualState> </VisualStateGroup>
</VisualStateManager.VisualStateGroups> </Entry>
44 msdn magazine
Xamarin.Forms