On Device Platform
Sometimes you want to have different values or different content on different platforms. For example, you might want to use one color on Android and a different color on iOS to match the native look. This extension allows you to provide differing values depending on which platform the device is running on.

Properties

Property
Type
Description
Android
object
The value to be used when the device is running on Android.
iOS
object
The value to be used when the device is running on iOS.
Default
object
The value to be used when the device is running on something else.

Example

1
<Label Text="Hello World!"
2
TextColor="{Rock:OnDevicePlatform Android=Blue, iOS=Red, Default=Black}" />
Copied!
When running on an Android device, the text will be blue. If instead running on an iOS device then the text will be red. Otherwise the text will be black. While not currently required, the Default value should be specified in case we add other platforms in the future.
1
<StackLayout>
2
<Rock:OnDevicePlatform>
3
<Rock:OnDevicePlatform.Android>
4
<Button Text="Go" />
5
</Rock:OnDevicePlatform.Android>
6
<Rock:OnDevicePlatform.Default>
7
<Label Text="This feature required Android." />
8
</Rock:OnDevicePlatform.Default>
9
</Rock:OnDevicePlatform>
10
</StackLayout>
Copied!
Here is a more interesting example. In this case we are replacing not just a property but an entire element. On Android, they will see a button which they can tap. On every other platform they will see a label that informs them the feature only works on Android.
Last modified 1yr ago
Copy link