Xamarin Forms-如何横置组件

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,897评论 25 709
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,263评论 4 61
  • 二月二,民俗称此日为龙抬头。小时候我不知道这些,只知道这一天是父亲的生日。那时候我还不知道父亲是否在乎我,只知道我...
    青崖白鹿A阅读 856评论 4 1
  • 读完这一章和下一章,会解决你的很多健身问题,诸如: 怎么区别肌肉腿和脂肪腿? 所谓“软脂肪”和“硬脂肪”是怎么回事...
    仰望尾迹云阅读 765评论 1 7
  • 浪淘沙.忆云师生活 春意已阑珊, 梦忆葵山。 四方年少聚一班。 花样年华无忧虑, 尽日清欢。 往事似如前, 转眼多...
    沙湖小景阅读 364评论 8 13