Jump to: navigation, search

Difference between revisions of "Converters In Xamarin"


Line 4: Line 4:
  
 
= List of Available Converters =
 
= List of Available Converters =
The following list contains all currently available converters for UBIK Xamarin customizing.
+
The following list contains all currently available converters for UBIK Xamarin customizing.  
 +
 
 +
'''Two-way''' converters can be used with two-way bindings, e.g. a text-box displaying an editable value. If the value updates in the model, the text-box text changes. If the user edits the value, the value in the model behind also gets updated.
 +
 
 
{| class="wikitable sortable" style="width:100%"
 
{| class="wikitable sortable" style="width:100%"
 
|-
 
|-
Line 21: Line 24:
 
Converts a '''byte stream''' value into an '''image source'''.
 
Converts a '''byte stream''' value into an '''image source'''.
 
|-  
 
|-  
| ChildAreaTemplateConverter || style="text-align: center;" | ✗ || ChildAreaTemplate || ContentViewModel || ||  
+
| ChildAreaTemplateConverter || style="text-align: center;" | ✗ || Child<wbr/>Area<wbr/>Template || Content<wbr/>ViewModel || ||  
Returns a '''ChildAreaTemplate''' from a '''ContentViewModel''' or ''null'' if the ViewModel cannot be interpreted.
+
Returns a '''ChildAreaTemplate''' from a '''Content<wbr/>ViewModel''' or ''null'' if the ViewModel cannot be interpreted.
 
|-  
 
|-  
| ChildItemSelectionModeTo<wbr/>SfListViewSelectionModeConverter || style="text-align: center;" | ✓ || [https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.SfListView~SelectionMode.html ListViewSelectionMode] || ChildItemSelectionMode || ||  
+
| ChildItem<wbr/>SelectionMode<wbr/>To<wbr/>SfListView<wbr/>SelectionMode<wbr/>Converter || style="text-align: center;" | ✓ || [https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.SfListView~SelectionMode.html ListView<wbr/>SelectionMode] || ChildItem<wbr/>SelectionMode || ||  
Converts a '''ChildItemSelectionMode''' to a Syncfusion '''[https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.SfListView~SelectionMode.html ListViewSelectionMode]'''. Default is "Single".
+
Converts a '''ChildItem<wbr/>SelectionMode''' to a Syncfusion '''[https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.SfListView~SelectionMode.html ListView<wbr/>SelectionMode]'''. Default is "Single".
 
|-  
 
|-  
 
| ClassificationToBoolConverter || style="text-align: center;" | ✗ || Boolean || ContentViewModel || ||  
 
| ClassificationToBoolConverter || style="text-align: center;" | ✗ || Boolean || ContentViewModel || ||  
Line 39: Line 42:
 
|-  
 
|-  
 
| DateTimeOffsetToDateConverter || style="text-align: center;" | ✓ || [https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime] || [https://docs.microsoft.com/en-us/dotnet/api/system.datetimeoffset DateTimeOffset] || ||  
 
| DateTimeOffsetToDateConverter || style="text-align: center;" | ✓ || [https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime] || [https://docs.microsoft.com/en-us/dotnet/api/system.datetimeoffset DateTimeOffset] || ||  
Converts a '''[https://docs.microsoft.com/en-us/dotnet/api/system.datetimeoffset DateTimeOffset]''' to the correct '''[https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime]'''. If the value cannot be interpreted, a new ''DateTime'', generated from the device's current time (<code>DateTime.Now</code>) is returned.
+
Converts a '''[https://docs.microsoft.com/en-us/dotnet/api/system.datetimeoffset DateTimeOffset]''' to the correct '''[https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime]''', applied to the current date and time. If the value cannot be interpreted, a new ''DateTime'', generated from the device's current time (<code>DateTime.Now</code>) is returned.
 
|-  
 
|-  
 
| DateTimeToFromNowStringConverter || style="text-align: center;" | ✗ || String || [https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime] || ||  
 
| DateTimeToFromNowStringConverter || style="text-align: center;" | ✗ || String || [https://docs.microsoft.com/en-us/dotnet/api/system.datetime DateTime] || ||  
Line 63: Line 66:
 
Returns ''true'' if the given value and parameter are '''not equal to each other''', ''false'' otherwise.
 
Returns ''true'' if the given value and parameter are '''not equal to each other''', ''false'' otherwise.
 
|-  
 
|-  
| SelectionChangedEventArgsConverter || style="text-align: center;" | ✗ || [https://docs.microsoft.com/en-us/dotnet/api/system.windows.controls.selectionchangedeventargs ListSelectionChangedEventArgs] || [https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.ItemSelectionChangedEventArgs.html ItemSelectionChangedEventArgs] || ||  
+
| SelectionChangedEventArgsConverter || style="text-align: center;" | ✗ || [https://docs.microsoft.com/en-us/dotnet/api/system.windows.controls.selectionchangedeventargs List<wbr/>Selection<wbr/>Changed<wbr/>EventArgs] || [https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.ItemSelectionChangedEventArgs.html Item<wbr/>Selection<wbr/>Changed<wbr/>EventArgs] || ||  
Converts an Syncfusion '''[https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.ItemSelectionChangedEventArgs.html ItemSelectionChangedEventArgs]''' to a '''[https://docs.microsoft.com/en-us/dotnet/api/system.windows.controls.selectionchangedeventargs ListSelectionChangedEventArgs]'''. <br/>The use-case of this converter is highly specific.
+
Converts an Syncfusion '''[https://help.syncfusion.com/cr/cref_files/xamarin/Syncfusion.SfListView.XForms~Syncfusion.ListView.XForms.ItemSelectionChangedEventArgs.html Item<wbr/>Selection<wbr/>Changed<wbr/>EventArgs]''' to a '''[https://docs.microsoft.com/en-us/dotnet/api/system.windows.controls.selectionchangedeventargs List<wbr/>Selection<wbr/>Changed<wbr/>EventArgs]'''. <br/>The use-case of this converter is highly specific.
 
|-  
 
|-  
| FilterCriterionToValueConverter || style="text-align: center;" | ✓ || String || FilterCrieterion || ||  
+
| FilterCriterionToValueConverter || style="text-align: center;" | ✓ || String || FilterCriterion || ||  
Converts a '''FilterCriterion''' to its value. The functionality is similar to UWP's FilterCriterionToValueConverter.
+
Converts a [[Property_Based_Content_Filters|'''FilterCriterion''']] to its value. The functionality is similar to UWP's FilterCriterionToValueConverter.
 
|-  
 
|-  
 
| GuidPropertyValueConverter || style="text-align: center;" | ✓ || String || Guid || Binding, where source is ContentViewModel ||  
 
| GuidPropertyValueConverter || style="text-align: center;" | ✓ || String || Guid || Binding, where source is ContentViewModel ||  
Line 73: Line 76:
 
|-  
 
|-  
 
| IntToColorConverter || style="text-align: center;" | ✗ || Color || Integer || ||  
 
| IntToColorConverter || style="text-align: center;" | ✗ || Color || Integer || ||  
Converts an '''integer''' value to a '''color'''. If the value cannot be interpreted, the converter tries to parse the parameter as a ''color'' to return it. If everything fails, ''transparent'' is returned.
+
Converts an ARGB '''integer''' value to a '''color'''. If the value cannot be interpreted, the converter tries to parse the parameter as a ''color'' to return it. If everything fails, ''transparent'' is returned.
 
|-  
 
|-  
 
| ItemCountToBoolConverter || style="text-align: center;" | ✗ || Boolean || Integer || Integer ||  
 
| ItemCountToBoolConverter || style="text-align: center;" | ✗ || Boolean || Integer || Integer ||  
Line 94: Line 97:
 
|-  
 
|-  
 
| PropertyNameExistsToBoolConverter || style="text-align: center;" | ✗ || Boolean (Nullable) || ContentViewModel,<br/>IContent || ||  
 
| PropertyNameExistsToBoolConverter || style="text-align: center;" | ✗ || Boolean (Nullable) || ContentViewModel,<br/>IContent || ||  
Converts a property to a '''boolean statment''' based on its '''existence'''. If it exists, ''true'' will be returned, else ''false'' or ''null'' (if something couldn't be properly interpreted).
+
Converts a property to a '''boolean''' based on its '''existence'''. If it exists, ''true'' will be returned, else ''false'' or ''null'' (if something couldn't be properly interpreted).
 
|-  
 
|-  
 
| PropertyNameExistsToInvertedBoolConverter || style="text-align: center;" | ✗ || Boolean (Nullable) || ContentViewModel,<br/>IContent || ||  
 
| PropertyNameExistsToInvertedBoolConverter || style="text-align: center;" | ✗ || Boolean (Nullable) || ContentViewModel,<br/>IContent || ||  
Converts a property to a '''boolean statment''' based on its '''existence'''. If it exists, ''false'' will be returned, else ''true'' or ''null'' (if something couldn't be properly interpreted).
+
Converts a property to a '''boolean''' based on its '''existence'''. If it exists, ''false'' will be returned, else ''true'' or ''null'' (if something couldn't be properly interpreted).
 
|-  
 
|-  
 
| RootAreaTemplateConverter || style="text-align: center;" | ✗ || ContentView || Object || ||  
 
| RootAreaTemplateConverter || style="text-align: center;" | ✗ || ContentView || Object || ||  
Line 105: Line 108:
 
Converts a '''item''' of a '''selective list''' to its value. If none is found, the passed ''value'' will be returned.
 
Converts a '''item''' of a '''selective list''' to its value. If none is found, the passed ''value'' will be returned.
 
|-  
 
|-  
| SelectiveListToItemsConverter || style="text-align: center;" | ✗ || List<ISelectiveItem<Boolean>>,<br/>List<ISelectiveItem<String>>,<br/>List<ISelectiveItem<Integer>>,<br/>List<ISelectiveItem<Double>>,<br/>List<ISelectiveItem<DateTime>>,<br/>List<ISelectiveItem<Guid>>,<br/>List<ISelectiveItem<FileReference>>,<br/>List<ISelectiveItem<GeoData>> || IPropertyItem || ||  
+
| SelectiveListToItemsConverter || style="text-align: center;" | ✗ || List of PropertyItems || IPropertyItem || ||  
 
Returns all items from a selective list.
 
Returns all items from a selective list.
 
|-  
 
|-  
Line 125: Line 128:
 
| TypeNameToBoolConverter || style="text-align: center;" | ✗ || Boolean || Object || String || Returns ''true'' if the type name of the value is present in the parameter-string (seperated by <code><nowiki>|</nowiki></code>).
 
| TypeNameToBoolConverter || style="text-align: center;" | ✗ || Boolean || Object || String || Returns ''true'' if the type name of the value is present in the parameter-string (seperated by <code><nowiki>|</nowiki></code>).
 
|-  
 
|-  
| TypeNameToInvertedBoolConverter || style="text-align: center;" | ✗ || Boolean || Object || String || Inverted ''TypeNameToBoolConverter''.
+
| TypeNameToInvertedBoolConverter || style="text-align: center;" | ✗ || Boolean || Object || String || Inverted ''TypeNameTo<wbr/>BoolConverter''.
 
|-  
 
|-  
| ValueValidityToBoolConverter || style="text-align: center;" | ✗ || Boolean || ValueValidity || || Returns ''true'' if the given ''ValueValidity'' has a '''higher importance''' than ''OK'' or ''Undefined''.
+
| DataTemplateItemTemplateSelectorConverter || style="text-align: center;" | ✗ || ChildItem<wbr/>Template<wbr/>Selector || String || String || Chooses what '''ChildItem<wbr/>Template<wbr/>Selector''' to return. Having a parameter with the content "Small" returns the small item template selector.
 
|-  
 
|-  
| ValueValidityToInvertedBoolConverter || style="text-align: center;" | ✗ || Boolean || ValueValidity || || Inverted ''ValueValidityToBoolConverter''.
+
| DataTemplateItemsPanelConverter || style="text-align: center;" | ✗ || ItemsPanelTemplate || Query<wbr/>Details<wbr/>Page<wbr/>ViewModel || || Chooses what '''ItemPanel<wbr/>Template''' to return. Having a parameter with the content "Small" returns the small item template selector.
|-
+
| DataTemplateItemTemplateSelectorConverter || style="text-align: center;" | ✗ || ChildItemTemplateSelector || String || String || Chooses what '''ChildItemTemplateSelector''' to return. Having a parameter with the content "Small" returns the small item template selector.
+
|-
+
| DataTemplateItemsPanelConverter || style="text-align: center;" | ✗ || ItemsPanelTemplate || QueryDetailsPageViewModel || || Chooses what '''ItemPanelTemplate''' to return. Having a parameter with the content "Small" returns the small item template selector.
+
 
|}
 
|}
 
=== Definition ===
 
=== Definition ===

Revision as of 12:23, 7 August 2019

Converters are used to prepare application data to format a UI defined by a XAML markup. These converters make it possible to show elements only when specific conditions (like data being available) are met. This allows the creation of a good UI with XAML code only, improving code readability while also decreasing code complexity.

This page explains how to properly use converters for customizing the UBIK Xamarin User Interface. Furthermore, all available converters are listed to provide a good reference.

List of Available Converters

The following list contains all currently available converters for UBIK Xamarin customizing.

Two-way converters can be used with two-way bindings, e.g. a text-box displaying an editable value. If the value updates in the model, the text-box text changes. If the user edits the value, the value in the model behind also gets updated.

Converter 2-Way Output Type Input Type Parameter Type Description
BooleanConverter Boolean Boolean

Interprets the boolean value and returns it. If the value cannot be interpreted, false is returned.

BooleanInvertConverter Boolean Boolean

Interprets and converts a boolean into its inverted value. If the value cannot be interpreted, false is returned.

BooleanToFontAttributeConverter FontAttribute Boolean

Converts a boolean into a font attribute value. In detail, if the value is true, the parameter is interpreted (Bold, Italic, None) and returned. The default returned font-attribute is None.

ByteToImageSourceValueConverter ImageSource Byte[ ],
Byte Stream

Converts a byte stream value into an image source.

ChildAreaTemplateConverter ChildAreaTemplate ContentViewModel

Returns a ChildAreaTemplate from a ContentViewModel or null if the ViewModel cannot be interpreted.

ChildItemSelectionModeToSfListViewSelectionModeConverter ListViewSelectionMode ChildItemSelectionMode

Converts a ChildItemSelectionMode to a Syncfusion ListViewSelectionMode. Default is "Single".

ClassificationToBoolConverter Boolean ContentViewModel

Returns a boolean indicating whether the given ContentViewModel is successfully classified.

ContainsToBoolConverter Boolean String,
Guid,
Object

Checks if the delivered value is contained within a collection of values (delivered in the parameter, seperated with |). If the value is contained, true will be returned, else false. The functionality is similar to the ContainsToVisibilityConverter in the WinX project.

ContainsToInvertedBoolConverter Boolean String,
Guid,
Object

Same as the ContainsToBoolConverter, but with inverted output.

ContentAreaTeamplateConverter UBIKContentArea ContentViewModel This converter is not yet finished and just returns the UBIKContentArea if the value is a ContentViewModel.
DateTimeOffsetToDateConverter DateTime DateTimeOffset

Converts a DateTimeOffset to the correct DateTime, applied to the current date and time. If the value cannot be interpreted, a new DateTime, generated from the device's current time (DateTime.Now) is returned.

DateTimeToFromNowStringConverter String DateTime

Returns a DateTime into a human-readable and easily understandable string message (the last applying one will be taken):

  • Less than 5 minutes in the past: Just now
  • Less than 10 minutes in the past: A few minutes ago
  • Less than 1 hour in the past: An hour ago
  • Less than 23 Hours in the past: Some hours ago
  • Less than 1 day in the past: Yesterday
  • More than 1 day in the past: The DateTime value formatted according to the device's localization rules.
  • Not interpretable: ???
DebugConverter Object Object

A converter returning the given value for debug reasons.

DistanceToStringConverter String Double

Returns the given value interpreted as length. Values are returned in kilometers with two comma digits (e.g. 2.84km), values smaller than 1km are returned as meters and NaN will be returned as infinity. If the value cannot be interpreted, an empty string will be returned.

EqualityToBoolConverter Boolean Object,
String
Object,
String

Returns true if the given value and parameter are equal to each other, false otherwise.

EqualityToInvertedBoolConverter Boolean Object,
String
Object,
String

Returns true if the given value and parameter are not equal to each other, false otherwise.

SelectionChangedEventArgsConverter ListSelectionChangedEventArgs ItemSelectionChangedEventArgs

Converts an Syncfusion ItemSelectionChangedEventArgs to a ListSelectionChangedEventArgs.
The use-case of this converter is highly specific.

FilterCriterionToValueConverter String FilterCriterion

Converts a FilterCriterion to its value. The functionality is similar to UWP's FilterCriterionToValueConverter.

GuidPropertyValueConverter String Guid Binding, where source is ContentViewModel

Returns the first item of the parameter's Source-ViewModel that matches the given GUID value. If none is found, null is returned.

IntToColorConverter Color Integer

Converts an ARGB integer value to a color. If the value cannot be interpreted, the converter tries to parse the parameter as a color to return it. If everything fails, transparent is returned.

ItemCountToBoolConverter Boolean Integer Integer

This converter has a property to set the boolean return value, called LesserThanReturnValue. This property-value will be returned if the given value is smaller than or equal to the threshold (parameter, defaults to 0). If the value is bigger than the threshold, the inverted LesserThanReturnValue will be returned.
In any other case (like the value cannot be interpreted), false is returned, so it's a good idea to set the converter's property in a way that the return is only true if you need it.

ItemCountToOverflowConverter String Integer Integer Creates a human-readable text indicating how many items are available. The value will be interpreted as the total item count and the parameter as overflow threshold (defaults to 99).
If there are more items than the overflow, the overflow value with a + sign will be returned (e.g. 99+). If not, the value itself will be returned. If everything fails, null is returned.
NullToBoolConverter Boolean Object,
String

Null or an empty string value get converted to true, and everything else to false.

NullToInvertedBoolConverter Boolean Object,
String

Null or an empty string value get converted to false, and everything else to true.

PathToImageSourceValueConverter Image Source String

Reads the path provided as parameter and creates an image source from it.

PercentageToProgressConverter Double Integer,
Double

The numeric value (int or double), interpreted as percentage from 0 to 100, get converted to a progress level (0 to 1). Values outside this range will be contained.

PropertyNameExistsToBoolConverter Boolean (Nullable) ContentViewModel,
IContent

Converts a property to a boolean based on its existence. If it exists, true will be returned, else false or null (if something couldn't be properly interpreted).

PropertyNameExistsToInvertedBoolConverter Boolean (Nullable) ContentViewModel,
IContent

Converts a property to a boolean based on its existence. If it exists, false will be returned, else true or null (if something couldn't be properly interpreted).

RootAreaTemplateConverter ContentView Object

If the provided value is not null, the UBIKRootArea template will be returned.

SelectiveItemToValueConverter Boolean,
String,
Integer,
Double,
DateTime,
Guid,
FileReferenceData,
GeoData,
Object
Boolean,
String,
Integer,
Double,
DateTime,
Guid,
FileReferenceData,
GeoData,
Object
Binding, where source is ContentViewModel

Converts a item of a selective list to its value. If none is found, the passed value will be returned.

SelectiveListToItemsConverter List of PropertyItems IPropertyItem

Returns all items from a selective list.

SfDataSourceConverter DataSource (for ListView) Double String (Expression)

It's an advanced converter used for loading items and applying filters on it. It replaces to CollectionToViewConverter from the WinX.UWP project. The data source can be directly used with a SfListView.

StringContainsToBoolConverter Boolean String String

Returns a boolean indicating whether the parameter string is included in the value string.

StringContainsToInvertedBoolConverter Boolean String String

Same as the StringContainsToBoolConverter but with inverted output.

StringFormatConverter String Object String Allows the creation of a nicely formatted string message, similar to C#'s String.Format method.
The value will be interpreted as the {0} element, and the parameter is the template string (e.g. The total count is: {0}!. Up to two additional parameters, named Parameter1 and Parameter2, can be defined at the converter declaration. Adding formatting options to the {0} notation is not possible.
ToStringFormatConverter String Double,
Float,
Integer,
DateTime,
String
String Converts primitives or DateTime to string and allows the application of formatting options (as parameter).
Adding a . to the end of the format-parameter allows truncation of all decimal places.
ToTypeConverter Object Object String Attempts to convert value to the Type specified in parameter, returning the value.
TypeNameToBoolConverter Boolean Object String Returns true if the type name of the value is present in the parameter-string (seperated by |).
TypeNameToInvertedBoolConverter Boolean Object String Inverted TypeNameToBoolConverter.
DataTemplateItemTemplateSelectorConverter ChildItemTemplateSelector String String Chooses what ChildItemTemplateSelector to return. Having a parameter with the content "Small" returns the small item template selector.
DataTemplateItemsPanelConverter ItemsPanelTemplate QueryDetailsPageViewModel Chooses what ItemPanelTemplate to return. Having a parameter with the content "Small" returns the small item template selector.

Definition

In Xamarin, before converters can be used, they need to be defined in the page's Resources tag. Make sure to include the UBIK.CPL.Converters namespace in the namespace definitions! The following example shows how the NullToBoolConverter can be defined:

<ContentView x:Class="UBIK.CPL.Resources.UBIKChildArea"
   xmlns="http://xamarin.com/schemas/2014/forms"
   xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
   xmlns:converters="clr-namespace:UBIK.CPL.Converters;assembly=UBIK.CPL">
    <ContentView.Resources>
        <ResourceDictionary>
            <converters:NullToBoolConverter x:Key="NullToBool" />
        </ResourceDictionary>
    </ContentView.Resources>

    <!-- Cuztomizing -->

</ContentView>

The key NullToBool makes this converter accessible from the customizing in this page.

Usage

A converter can only be used in conjunction with a {Binding}. The following is an easy example, showing how the NullToBool converter, defined above, can be used.

<Label Text="My Text" IsVisible="{Binding MyBindableProperty, Converter={StaticResource NullToBool}}"/>

If MyBindableProperty is null or an empty string, the converter will return true, making the Label visible!

Parameter

Some converters accept a ConverterParameter, that passes additional information. Closely read the description of the available converters to find out which accept or even require a parameter to work properly. In Ubik, some converters accept a string parameter, consisting of multiple individual parameters separated by |.

An example of this behavior is the ContainsToBoolConverter, which checks if the current value is contained within a collection of values (passed as the parameter):

<Label Text="My Text" IsVisible="{Binding MyValue, Converter={StaticResource ContainsToBool}, ConverterParameter=1|2|3|4|5|6|7|8|9}"/>

The label will only be visible if the MyValue property (which is expected to parse as an Integer in this example) is one of the values of the parameter.
Again, to get the converter working, don't forget to define it in the page's resources!

FallbackValue

In some rare cases, a converter might not return anything desired (like null) if some condition doesn't work out as it should (e.g. value is null). To still be able to get a usable return value, it's possible to define a FallbackValue.