When using multiple Lists on one page (e.g. in a TabbedView), it is necessary to set the AutomationId property uniquely for each list on the page, to support the remembering of the ScrollPosition.
=== Delay and LazyLoading ===⚠️Important Note: Although both properties can be set in XAML on the two controls, this should not be done. When both the LazyLoading and Delay properties are set, the Delay property is ignored in the code-behind, as otherwise it could lead to unexpected behavior and, in the worst case, result in performance degradation. ==== Delay in UBIKContentView and ContentControl {{Version/MobileSince|5.1}} ====
More complex UIs create a delay in rendering which leads to a feeling of "unresponsiveness" when navigating through the client. This is because the app loads and displays everything at once, leading to a larger delay between triggering navigation and completion of page loading.
</tab>
</tabs>
==== Lazy Loading in UBIKContentView and ContentControl {{Version/MobileSince|5.1}} ====
To further improve performance, we have added a LazyLoading property to UBIKContentView and ContentControl. When a ContentTemplate is assigned to either of these controls and the LazyLoading property is set to true, the content is only loaded when it is explicitly requested. This can be used in combination with a UBIKTabView, so that only the content of the selected tab is rendered, while the content of non-selected tabs is not. When switching tabs, the content for the newly selected tab is rendered on demand. Lazy loading requires a trigger to determine when the content should be loaded. In the case of a UBIKTabView, this occurs when switching tabs. Alternatively, it can be triggered by, for example, a button with an IsClicked behavior. However, lazy loading always requires a trigger; otherwise, the content would never be loaded.
{| class="wikitable"
! UBIKContentView
! ContentControl
|-
|
<syntaxhighlight lang="xml">
<tabView:SfTabItem>
<tabView:SfTabItem.Content>
<controls:UBIKContentView
Converter="{StaticResource TemplateConverter}"
ConverterParameter="UBIKPropertyArea"
LazyLoading="True" />
</tabView:SfTabItem.Content>
</tabView:SfTabItem>
</syntaxhighlight>
||
<syntaxhighlight lang="xml">
<tabView:SfTabItem.Content>
<controls:ContentControl LazyLoading="True">
<controls:ContentControl.ContentTemplate>
<DataTemplate>
<Grid RowDefinitions="*,Auto">
<Label Text="MyLabel" />
<controls:CheckBox
Grid.Row="1"
IsChecked="True"
IsToggleButton="True" />
</Grid>
</DataTemplate>
</controls:ContentControl.ContentTemplate>
</controls:ContentControl>
</tabView:SfTabItem.Content>
</syntaxhighlight>
⚠️Please note: Although this is possible, care must be taken not to create excessive nesting, as this can ultimately lead to performance degradation if overused. For example, a grid inside a grid, inside another grid, and so on.
|-
|}
'''Another control as a trigger for lazy loading'''
Other controls (e.g., Button, CheckBox, etc.) can also serve as triggers for lazy loading. For instance, interacting with such a control can trigger lazy loading for a UBIKContentView or ContentControl.
<syntaxhighlight lang="xml">
<tabView:SfTabItem.Content>
<Grid RowDefinitions="*,50,*">
<controls:UBIKContentView x:Name="ChildContainer" Converter="{StaticResource ChildAreaTemplateConverter}" />
<Button
x:Name="LoadDocuments"
Grid.Row="1"
HeightRequest="50"
HorizontalOptions="Center"
Text="LazyLoadDocuments"
WidthRequest="200">
<Button.Behaviors>
<behaviors:EventHandlerBehavior EventName="Clicked">
<behaviors:InvokeMethodAction MethodName="TriggerLazyLoad" TargetObject="{Binding Source={x:Reference DocumentsAreaLoader}}" />
</behaviors:EventHandlerBehavior>
</Button.Behaviors>
</Button>
<controls:UBIKContentView
x:Name="DocumentsAreaLoader"
Grid.Row="2"
Converter="{StaticResource TemplateConverter}"
ConverterParameter="UBIKDocumentArea"
LazyLoading="True" />
</Grid>
</tabView:SfTabItem.Content>
</syntaxhighlight>
[[Category:Client|Xamarin XAML]]