Often times we need to hide Scrollbar displayed on ListView control. Starting from Xamarin Forms 3.5.0, we have the option of hiding Scrollbar on ListView control inbuilt. To hide it use-
To hide Vertical Scrollbar: VerticalScrollBarVisibility="Never"
To hide Horizontal Scrollbar: HorizontalScrollBarVisibility="Never"
Xamarin Forms ListView Hide Scrollbars Example:
We will create a simple Xamarin forms app with ListView control. We will display product information with product name and product price on our Listview control and hide the scrollbars on it. Create a Model class with name Products.cs
and edit it as below:
Models > Products.cs:
public class Products { public string product { get; set; } public string price { get; set; } }
Create a Listview control on your MainPage.xaml form like below:
MainPage.xaml:
<?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:local="clr-namespace:XamSample" x:Class="XamSample.MainPage" Title="Xamarin ListView"> <StackLayout Orientation="Vertical" Padding="5"> <ListView x:Name="lstProducts" BackgroundColor="White" SeparatorColor="#000" CachingStrategy="RecycleElement" RowHeight="70" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <StackLayout Orientation="Vertical" Padding="5"> <StackLayout Orientation="Horizontal"> <Label Text="Product:" TextColor="#000" Margin="2"/> <Label Text="{Binding product}" TextColor="#000" Margin="2" FontAttributes="Bold" /> </StackLayout> <StackLayout Orientation="Horizontal"> <Label Text="Price:" TextColor="#000" Margin="2"/> <Label Text="{Binding price}" TextColor="#000" Margin="2" FontAttributes="Bold" /> </StackLayout> </StackLayout> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> </StackLayout> </ContentPage>
And edit its code-behind like below. We will bind the Listview control using ObservableCollection
of type Products class.
MainPage.xaml.cs:
using System; using System.Collections.ObjectModel; using Xamarin.Forms; using XamSample.Models; namespace XamSample { public partial class MainPage : ContentPage { public MainPage() { InitializeComponent(); BindList(); } public void BindList() { try { ObservableCollection<Products> ob = new ObservableCollection<Products>(); Random r = new Random(1); for (int i = 0; i < 100; i++) { ob.Add(new Products { price = r.Next(1, 100000).ToString(), product = "A" + i }); } lstProducts.ItemsSource = ob; } catch (Exception ex) { } } } }
The BindList()
method will bind our ListView control. Now run your App.
Result:
To hide Scrollbars of this ListView control using code-behind, you can use:
lstProducts.VerticalScrollBarVisibility = ScrollBarVisibility.Never; lstProducts.HorizontalScrollBarVisibility = ScrollBarVisibility.Never;
Also see:
Xamarin Forms Button Press CommandParameter
Xamarin forms SQLite DB – Perform CRUD operation.
Xamarin forms SkiaSharp – Creating different shapes
Xamarin forms Creating SQLite Database
Xamarin forms Creating Custom Button control