Quick Start Tutorial: Creating Universal Apps via Xamarin: Label and Button - Part Three

Read the previous part of the series here:

1. Quick Start Tutorial: Creating Universal Apps Via Xamarin - Part One
2. Quick Start Tutorial: Creating Universal Apps Via Xamarin - Part Two

This article explains about the Label and Button controls.

Label Control

Label is used to display the read-only information to the user, its header text or identity nearby control and this property supports multilane read-only text ( look like Rich Text Edit box).

Highlighted Properties

• Text - Assign the text to display the information
• TextColor - Change the Text colour

Formatted String

This property is used to support the multilane read only, we can make and set the different styles (format) of the word or the lines, this class contains the collection of the span controls and it's assigned to the Label Format string, Internally based on each format (like one word red color or different font size) assigned to the one span control & it will add to the Formatted string object, finally it assigns to the Label control.



Span Control

Span control is used to format the text, it contains Text, Color and changes the font style properties.



Creating span of controls and ading to the FormattedString class object.

Example

Each format assigns to each span control.



Assign the Formatted String in Xaml.



UWP output



New line

Add the Unicode in the string in the text field, span control move to the next line



Android output



Button

Button is a common control, generally is used for both Desktop and Mobile application, users who want to trigger any action button will use  and trigger handling via click event.

Example

Button & Label control





Note

Xamarin does not support all properties to all the platforms.

Example

Button Border property.


In iOS platform all the border properties will be set. Windows Phone: Border width and Border Color has been set and Android: All the border property has been ignored. (Will see later some workaround for how to support border properties to all the platforms).