Tips and Tricks in Xamarin Forms

 Hi Developer, I hope all you are fine.

Lets start with tips and tricks for xamarin form which will be useful for you.

For better understand please watch video.

RefreshView

The Refreshview is a container control that provides pull to refresh functionality for scrollable content. 

This control will work if you have use scrollview.

sometime we use only listview or collectionview which does not required scrollview, if we use scrollview the it will show space at the bottom of the page.so simply write below code:

<RefreshView x:Name="refreshView" Refreshing="refreshView_Refreshing">
            <ScrollView x:Name="MainScroll">
                <ContentView HeightRequest="{Binding Source={x:Reference MainScroll},Path=Height}">
                    <!---- Your UI Design-->
                </ContentView>
            </ScrollView>
        </RefreshView>

Activity Indicator

Refreshview show loader on top of the page, if you want to show loader in the center of the page then use Activity Indicator.

<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

            <StackLayout AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
                 <!--Add your UI Design here-->
            </StackLayout>

            <StackLayout x:Name="SAI" IsVisible="False" Padding="12" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="0.5,0.5,-1,-1">

                <ActivityIndicator x:Name="AI" IsRunning="False" Color ="Blue"/>

            </StackLayout>

  </AbsoluteLayout>
        <!----- Use in .cs file-->    
         AI.IsRunning = SAI.IsVisible = true;   
        <!-------Your code-->   
        AI.IsRunning = SAI.IsVisible = false;

Cntrl + D

If you want to write same line as above the we are using cntrl + C and cntrl + V, instead of using cntrl + D will copy and paste above line.

Grid RowDefinition and ColumnDefinition

Generally everyone writing rowdefinition and columndefinition as below code:

      <Grid>
            <Grid.RowDefinitions >
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="40"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions >
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
        </Grid>

 Instead you can write following code:

<Grid RowDefinitions="Auto,*,40" ColumnDefinitions="Auto,*"></Grid>

Listview HasUnevenRows Property

Use HasUnevenRows property in listview, it will create height as per data else it will take fixed height whether data is more or less.

Method for Dynamic Class

In project, developer may required method should do same logic but class is different, create below method. For example, I want to pass model from one page to another page.

    public static class Helper
    {
       public static object PageData { get; set; }        

        public static T PassData<T>(object obj) where T : new()
        {
            PageData = (T)obj;
            return (T)PageData;
        } 
    }
        

Use as below:

      var data = (CommunityResultViewModel)cv.SelectedItem;
      Helper.PassData<CommunityResultViewModel>(data);
   
    var data = (CommunityResultViewModel)Helper.PageData;

Use DataType in DataTemplate

for example you have create a template for listview and that template has bindable control. using datatype in main control will bring property of bindable class in intellisense. 

     <Grid RowDefinitions="130,Auto"  Margin="-20" x:DataType="vm:ViewModel">
          <Image Source="{Binding Image}" Grid.Row="0" HeightRequest="100" Aspect="Fill"></Image>
          <Label Text="{Binding title}" Margin="10,5,10,10" HeightRequest="35" VerticalOptions="Center" Grid.Row="1" Style="{x:DynamicResource PoppinsLabel}" FontSize="{x:DynamicResource NormalFontSize}"></Label>
     </Grid>     

Assign value from static class in page

Add reference of the class in page. call property using that reference. for example

Add reference

xmlns:vm="clr-namespace:demo.App.Utility"

Get value of static property

<Label x:Name="lbl" Text="{x:Static vm:solid.Angle_Down }">

For better understand please watch video.

Hope you like this tutorial, hope it is help full to you. Please share your feedback in comment section, Thanks for reading.