Xamarin.Forms 解决ListView高度问题

在设计中，ListView需要嵌套到StackLayout中，但是ListView会出现一片空白部分，如何移除空白部分？

问题如图所示：

Xaml代码：

 1 <?xml version="1.0" encoding="utf-8" ?>
 2 <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
 3              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
 4              x:Class="XFPractice.Pages.ContactsPage">
 5
 6     <StackLayout Orientation="Vertical">
 7
 8         <ListView x:Name="MyListView"
 9             ItemsSource="{Binding Items}"
10             ItemTapped="Handle_ItemTapped"
11             HasUnevenRows="True"
12             VerticalOptions="Start"
13             CachingStrategy="RecycleElement">
14
15             <ListView.ItemTemplate>
16                 <DataTemplate>
17                     <TextCell Height="36" Text="{Binding .}" />
18                 </DataTemplate>
19             </ListView.ItemTemplate>
20         </ListView>
21
22         <StackLayout Grid.Row="1" Orientation="Vertical" VerticalOptions="FillAndExpand">
23             <Button Text="按钮一" Margin="12,0"/>
24             <Button Text="按钮二" Margin="12,0"/>
25         </StackLayout>
26     </StackLayout>
27 </ContentPage>

View Code

C#代码：

 1 using System;
 2 using System.Collections.ObjectModel;
 3 using System.ComponentModel;
 4 using System.Linq;
 5 using System.Threading.Tasks;
 6
 7 using Xamarin.Forms;
 8 using Xamarin.Forms.Xaml;
 9
10 namespace XFPractice.Pages
11 {
12     [XamlCompilation(XamlCompilationOptions.Compile)]
13     public partial class ContactsPage : ContentPage
14     {
15         public ObservableCollection<string> Items { get; set; }
16
17         public ContactsPage()
18         {
19             InitializeComponent();
20
21             Title = "通讯录";
22
23             Items = new ObservableCollection<string>
24             {
25                 "Item 1",
26                 "Item 2",
27                 "Item 3",
28                 "Item 4",
29                 "Item 5"
30             };
31
32         MyListView.ItemsSource = Items;
33
34         }
35
36
37         void Handle_ItemTapped(object sender, ItemTappedEventArgs e)
38         {
39             if (e.Item == null)
40                 return;
41             ((ListView)sender).SelectedItem = null;
42         }
43     }
44 }

View Code

解决方案：

通过每个Item的高度计算出ListView的高度。Demo中每个Item的高度为36，一共有5个Item，那么此时ListView的高度为36*5。

MyListView.HeightRequest = 36 * 5;

仅仅如此还不够，需要在与ListView同级别的StackLayout设置VerticalOptions="FillAndExpand"。

效果如图所示：

Xaml代码：

 1 <?xml version="1.0" encoding="utf-8" ?>
 2 <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
 3              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
 4              x:Class="XFPractice.Pages.ContactsPage">
 5
 6     <StackLayout Orientation="Vertical">
 7
 8         <ListView x:Name="MyListView"
 9             ItemsSource="{Binding Items}"
10             ItemTapped="Handle_ItemTapped"
11             HasUnevenRows="True"
12             VerticalOptions="Start"
13             CachingStrategy="RecycleElement">
14
15             <ListView.ItemTemplate>
16                 <DataTemplate>
17                     <TextCell Height="36" Text="{Binding .}" />
18                 </DataTemplate>
19             </ListView.ItemTemplate>
20         </ListView>
21
22         <StackLayout Grid.Row="1" Orientation="Vertical" VerticalOptions="FillAndExpand">
23             <Button Text="按钮一" Margin="12,0"/>
24             <Button Text="按钮二" Margin="12,0"/>
25         </StackLayout>
26     </StackLayout>
27 </ContentPage>

View Code

C#代码：

 1 using System;
 2 using System.Collections.ObjectModel;
 3 using System.ComponentModel;
 4 using System.Linq;
 5 using System.Threading.Tasks;
 6
 7 using Xamarin.Forms;
 8 using Xamarin.Forms.Xaml;
 9
10 namespace XFPractice.Pages
11 {
12     [XamlCompilation(XamlCompilationOptions.Compile)]
13     public partial class ContactsPage : ContentPage
14     {
15         public ObservableCollection<string> Items { get; set; }
16
17         public ContactsPage()
18         {
19             InitializeComponent();
20
21             Title = "通讯录";
22
23             Items = new ObservableCollection<string>
24             {
25                 "Item 1",
26                 "Item 2",
27                 "Item 3",
28                 "Item 4",
29                 "Item 5"
30             };
31
32             MyListView.ItemsSource = Items;
33
34             this.Appearing += ContactsPage_Appearing;
35         }
36
37         private void ContactsPage_Appearing(object sender, EventArgs e)
38         {
39             MyListView.HeightRequest = 36 * 5;
40         }
41
42         void Handle_ItemTapped(object sender, ItemTappedEventArgs e)
43         {
44             if (e.Item == null)
45                 return;
46             ((ListView)sender).SelectedItem = null;
47         }
48     }
49 }

View Code

转载于:https://www.cnblogs.com/devin_zhou/p/8327606.html

Xamarin.Forms 解决ListView高度问题相关推荐

Xamarin.Forms单元控件Cell
Xamarin.Forms单元控件Cell 单元控件Cell是Xamarin.Forms为ListView和TableView专门定制的一类项目元素.它包括5个控件,分别为文本框单元EntryCell ...
Xamarin.Forms: 无限滚动的ListView（懒加载方式）
说明在本博客中,学习如何在Xamarin.Forms应用程序中设计一个可扩展的无限滚动的ListView.这个无限滚动函数在默认的Xamarin.Forms不存在,因此我们需要为此添加插件.在这里我 ...
使用Xamarin.Forms的企业应用程序模式（电子书）--访问远程数据
许多现代的基于Web的解决方案利用由Web服务器托管的Web服务来为远程客户端应用程序提供功能. Web服务公开的操作构成Web API. 客户端应用程序应该能够在不知道API暴露的数据或操作如何实现 ...
Xamarin.Forms入门-使用 Xamarin.Forms 来创建跨平台的用户界面
Xamarin.Forms 是一个跨平台的.基于原生控件的UI工具包,开发人员可以轻松的创建适用于 Android,iOS 以及 Windows Phone的用户界面.Xamarin.Forms 通过 ...
Xamarin.Forms——尺寸大小（五 Dealing with sizes）
原文: Xamarin.Forms--尺寸大小(五 Dealing with sizes) 如之前所见的大量可视化元素均有自己的尺寸大小: iOS的状态栏高度为20,所以我们需要调整iOS的页面的Pa ...
张高兴的 Xamarin.Forms 开发笔记：为 Android 与 iOS 引入 UWP 风格的汉堡菜单 ( MasterDetailPage )...
所谓 UWP 样式的汉堡菜单,我曾在"张高兴的 UWP 开发笔记:汉堡菜单进阶"里说过,也就是使用 Segoe MDL2 Assets 字体作为左侧 Icon,并且左侧使用填充颜色 ...
Xamarin.Forms获取设备屏幕大小
Xamarin.Forms获取设备屏幕大小可以借助device.Display获取.基本形式如下: var display = device.Display; 然后就可以获取屏幕大小. displa ...
C#使用Xamarin开发可移植移动应用(1.入门与Xamarin.Forms页面),附源码
前言系列目录 C#使用Xamarin开发可移植移动应用目录什么是Xamarin? Xamarin始创于2011年,旨在使移动开发变得难以置信地迅捷和简单. Xamarin的产品简化了针对多种平台的 ...
Xamarin.Forms中使用LiteDB分页
Xamarin.Forms中使用LiteDB分页在移动应用的开发中,为力提高用户体验,一般都会在本地设计一套数据缓存.这里我使用的是LiteDB来缓存数据. LiteDB是.Net平台的一个开源的N ...
使用Xamarin.Forms的企业应用程序模式（电子书）--依赖注入
通常,在实例化对象时调用类构造函数,并将对象需要的任何值作为参数传递给构造函数. 这是依赖注入的一个例子,具体称为构造函数注入. 对象需要的依赖项被注入到构造函数中. 通过将依赖项指定为接口类型,依赖 ...

Xamarin.Forms 解决ListView高度问题

Xamarin.Forms 解决ListView高度问题

Xamarin.Forms 解决ListView高度问题相关推荐

最新文章

热门文章