Hi,
In Xamarin Forms, the SideDrawer is appearing in Android but not appearing in iOS Simulator for which i looked into this earlier thread [Thread Link] but even after doing so mentioned in that thread as a fix, the SideDrawer still doesn't appear in the iOS Simulator please help me with this issue.
XAML Snippet :
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
x:Class="APP.LPage">
<StackLayout BackgroundColor="White" Spacing="0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<telerikPrimitives:RadSideDrawer x:Name="drawer" DrawerLength="250" >
<telerikPrimitives:RadSideDrawer.MainContent>
<StackLayout x:Name="LPageStack1" >
<telerikDataControls:RadListView x:Name="ViewBinding" ItemsSource=" {Binding Source}" SelectionMode="Single" SelectionGesture="Tap" HeightRequest="250">
<telerikDataControls:RadListView.ItemTemplate>
<DataTemplate>
<telerikListView:ListViewTemplateCell>
<telerikListView:ListViewTemplateCell.View>
<StackLayout Orientation="Horizontal" VerticalOptions="FillAndExpand">
<Label x:Name="ListCust" Text="{Binding Customer}" FontSize="Large" HorizontalOptions="StartAndExpand" HorizontalTextAlignment="Center"/>
<Label x:Name="ListWO" Text="{Binding WorkOrder}" FontSize="Large" HorizontalOptions="EndAndExpand" HorizontalTextAlignment="Center"/>
</StackLayout>
</telerikListView:ListViewTemplateCell.View>
</telerikListView:ListViewTemplateCell>
</DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>
</StackLayout>
</telerikPrimitives:RadSideDrawer.MainContent>
<telerikPrimitives:RadSideDrawer.DrawerContent>
<StackLayout VerticalOptions="CenterAndExpand">
<Button Text="Button 1" />
<Button Text="Button 2" />
<Button Text="Button 3" />
<Button Text="Button 4" />
</StackLayout>
</telerikPrimitives:RadSideDrawer.DrawerContent>
</telerikPrimitives:RadSideDrawer>
</StackLayout>
</ContentPage>
1 Answer, 1 is accepted
Thank you for sharing the code. I have a few comments and have built you a demo. Let me start with the suggestions.
Suggestions
StackLayout vs Grid
I strongly discourage using a StackLayout as the root element of any view. It has an infinite height which breaks most controls that rely on content or item UI virtualization. Especially if you're using a RadListView, read this troubleshooting paragraph (although your code does use an explicit HeightRequest for the RadListView, which resolves this particular issue)
I recommend switching to a Grid and only use a StackLayout for elements you wont tightly grouped together inside another layout control (for example your Buttons are a good use of StackLayout).
AndExpand
Another thing I notice is that some of the elements use FillAndExpand, use Fill instead. The AndExpand flag typically should only be used when you have other elements using FillAndExpand to measure with, a good example is how the two Labels in the item template use AndExpand
Project Configuration
Other than those suggestions, I do not see any problems with the code. If it still doesn't work for you, it could be a project configuration issue. Make sure you have all the SkiaSharp packages referenced and that all the projects are using the SideDrawer Required Telerik Assemblies.
Demo
I have gone ahead and build you a demo, which has my suggestions applied, and the result at runtime is as expected on the iOS simulator for iOS 11.4:
Here's the code (minus sample data):
<ContentPage ...> <!-- Change StackLayout ot Grid --> <Grid> <telerikPrimitives:RadSideDrawer x:Name="drawer" DrawerLength="250" > <telerikPrimitives:RadSideDrawer.MainContent> <!-- Change StackLayout ot Grid --> <Grid x:Name="LPageStack1" > <telerikDataControls:RadListView x:Name="ViewBinding" ItemsSource="{Binding Source}" SelectionMode="Single" SelectionGesture="Tap" HeightRequest="250"> <telerikDataControls:RadListView.ItemTemplate> <DataTemplate> <listView:ListViewTemplateCell> <listView:ListViewTemplateCell.View> <StackLayout Orientation="Horizontal" VerticalOptions="Fill"> <Label x:Name="ListCust" Text="{Binding Customer}" FontSize="Large" HorizontalOptions="StartAndExpand" HorizontalTextAlignment="Center"/> <Label x:Name="ListWO" Text="{Binding WorkOrder}" FontSize="Large" HorizontalOptions="EndAndExpand" HorizontalTextAlignment="Center"/> </StackLayout> </listView:ListViewTemplateCell.View> </listView:ListViewTemplateCell> </DataTemplate> </telerikDataControls:RadListView.ItemTemplate> </telerikDataControls:RadListView> </Grid> </telerikPrimitives:RadSideDrawer.MainContent> <telerikPrimitives:RadSideDrawer.DrawerContent> <StackLayout VerticalOptions="Center"> <Button Text="Button 1" /> <Button Text="Button 2" /> <Button Text="Button 3" /> <Button Text="Button 4" /> </StackLayout> </telerikPrimitives:RadSideDrawer.DrawerContent> </telerikPrimitives:RadSideDrawer> </Grid></ContentPage>Wrapping Up
If this answers your question, you can let me know by using the ticket's "Mark as resolved" button. If you have any further issues, please update my demo so that it replicates the problem and I'll be able to debug it directly.
Thank you for contacting Support and for choosing UI for Xamarin.
Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik