原理其实很简单,就是通过ListView的Rotation属性旋转即可。
如果你想做图片轮播话建议用scroview,如果page里面有一个竖向的listview也有一个横向的,会导致两者冲突,用scroview才对。代码换成scroview即可完美解决
例子如下:
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:TapListView"
x:Class="TapListView.MainPage">
<StackLayout Orientation="Horizontal">
<Button x:Name="Button1" Text="左滑" HorizontalOptions="FillAndExpand" Opacity="0.5"></Button>
<StackLayout HorizontalOptions="FillAndExpand">
<ListView x:Name="ListView" Rotation="90" HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Image Source="{Binding .}" Rotation="270"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand">
</Image>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
<Button x:Name="Button2" Text="右滑" Opacity="0.5"
HorizontalOptions="FillAndExpand"></Button>
</StackLayout>
</ContentPage>
MainPage.cs(这代码跟横置ListView没有关系)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace TapListView
{
public partial class MainPage : ContentPage
{
public List<ImageSource> ImageSources { get; set; } = new List<ImageSource>();
public MainPage()
{
InitializeComponent();
SetSource();
ListView.ItemsSource = ImageSources;
}
private void SetSource()
{
ImageSources.Add(ImageSource.FromUri(new Uri("http://img.youguoquan.com/uploads/magazine/content/4317b8660f13b0826380d5ef0c4bc963_magazine_web_m.jpg")));
ImageSources.Add(ImageSource.FromUri(new Uri("http://img.youguoquan.com/uploads/magazine/content/7621a57ace831fa0c8616fff6497edf3_magazine_web_m.jpg")));
ImageSources.Add(ImageSource.FromUri(new Uri("http://img.youguoquan.com/uploads/magazine/content/f5ff39f3f5304a45e8b8b4952fdca368_magazine_web_m.jpg")));
ImageSources.Add(ImageSource.FromUri(new Uri("http://img.youguoquan.com/uploads/magazine/content/1595ab2bad62fe267b55c1f450445136_magazine_web_m.jpg")));
}
}
}