美文网首页
Xamarin Forms-如何横置组件

Xamarin Forms-如何横置组件

作者: 本大少_ | 来源:发表于2017-06-05 23:23 被阅读0次

原理其实很简单,就是通过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")));
        }
    }
}

相关文章

网友评论

      本文标题:Xamarin Forms-如何横置组件

      本文链接:https://www.haomeiwen.com/subject/hhpwfxtx.html