C# 在桌面或手机的Gridview中设置网格

C# 在桌面或手机的Gridview中设置网格,c#,gridview,uwp,C#,Gridview,Uwp,我有一个gridview,其中有一个类似XAML的网格,如下所示: <Page.Resources> <DataTemplate x:Key="VideoDataTemplate"> <Grid Background="LightGray" Margin="5,10"> <Grid x:Name="VideoContent" Margin="10,10,0,0" Horizontal

我有一个gridview,其中有一个类似XAML的网格,如下所示:

<Page.Resources>
        <DataTemplate x:Key="VideoDataTemplate">
            <Grid Background="LightGray" Margin="5,10">
                <Grid x:Name="VideoContent" Margin="10,10,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" MaxWidth="350">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                        <RowDefinition Height="auto"/>
                    </Grid.RowDefinitions>

                    <Border Grid.Row="0" Margin="0,10,0,0" HorizontalAlignment="Center" BorderThickness="1" BorderBrush="Black" Background="{x:Null}">
                        <Image Margin="0,0,5,5" Source="{Binding Thumbnail}" Height="140" Width="200" HorizontalAlignment="Center"/>
                    </Border>

                    <ScrollViewer Grid.Row="1" Margin="10,10,10,0" HorizontalScrollMode="Auto" VerticalScrollMode="Disabled" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto">
                        <TextBlock Margin="0,0,10,10" Text="{Binding Title}" FontSize="18" FontWeight="SemiBold" TextWrapping="Wrap"/>
                    </ScrollViewer>
                    <TextBlock Grid.Row="2" Margin="15,0,10,10" Text="{Binding PubDate}" FontSize="16" TextWrapping="Wrap"/>

                    <ScrollViewer Grid.Row="3" Margin="10,10,10,10" MinHeight="40" MaxHeight="150" HorizontalScrollMode="Disabled" VerticalScrollMode="Auto" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Disabled" Background="{x:Null}">
                        <TextBlock Margin="0,0,10,10" Text="{Binding Description}" FontSize="16" TextWrapping="WrapWholeWords" Height="auto"/>
                    </ScrollViewer>
                </Grid>
            </Grid>
        </DataTemplate>
    </Page.Resources>

我想如果在桌面上MaxWidth=350,而在电话上MaxWidth=250


如何应用它?

我需要一个用户控件来实现它

我应该将您的代码移动到用户控制并使用自适应触发器

<UserControl
    x:Class="HwliqeaivFqeakkpfl.VideoPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:HwliqeaivFqeakkpfl"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">

    <Grid>
        <Grid Background="LightGray" Margin="5,10">
            <Grid x:Name="VideoContent" Margin="10,10,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" MaxWidth="350">
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>

                <Border Grid.Row="0" Margin="0,10,0,0" HorizontalAlignment="Center" BorderThickness="1" BorderBrush="Black" Background="{x:Null}">
                    <Image Margin="0,0,5,5" Source="{Binding Thumbnail}" Height="140" Width="200" HorizontalAlignment="Center"/>
                </Border>

                <ScrollViewer Grid.Row="1" Margin="10,10,10,0" HorizontalScrollMode="Auto" VerticalScrollMode="Disabled" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto">
                    <TextBlock Margin="0,0,10,10" Text="{Binding Title}" FontSize="18" FontWeight="SemiBold" TextWrapping="Wrap"/>
                </ScrollViewer>
                <TextBlock Grid.Row="2" Margin="15,0,10,10" Text="{Binding PubDate}" FontSize="16" TextWrapping="Wrap"/>

                <ScrollViewer Grid.Row="3" Margin="10,10,10,10" MinHeight="40" MaxHeight="150" HorizontalScrollMode="Disabled" VerticalScrollMode="Auto" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Disabled" Background="{x:Null}">
                    <TextBlock Margin="0,0,10,10" Text="{Binding Description}" FontSize="16" TextWrapping="WrapWholeWords" Height="auto"/>
                </ScrollViewer>
            </Grid>
        </Grid>
    </Grid>
</UserControl>
Thx用于

您应该删除VisualStateManager,然后在用户控件中添加此代码

    public VideoPage()
    {
        this.InitializeComponent();
        if (GetDeviceFormFactorType() == DeviceFormFactorType.Phone)
        {
            VideoContent.MaxWidth = 250;
        }
    }

简单!使用自适应触发器需要创建用户控件。
    <ListView x:Name="YqxczetXexj" >
        <ListView.ItemTemplate>
            <DataTemplate>
                <local:VideoPage></local:VideoPage>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
public static class DeviceTypeHelper
 {
    public static DeviceFormFactorType GetDeviceFormFactorType()
    {
        switch (AnalyticsInfo.VersionInfo.DeviceFamily)
        {
            case "Windows.Mobile":
                return DeviceFormFactorType.Phone;
            case "Windows.Desktop":
                return UIViewSettings.GetForCurrentView().UserInteractionMode == UserInteractionMode.Mouse
                    ? DeviceFormFactorType.Desktop
                    : DeviceFormFactorType.Tablet;
            case "Windows.Universal":
                return DeviceFormFactorType.IoT;
            case "Windows.Team":
                return DeviceFormFactorType.SurfaceHub;
            default:
                return DeviceFormFactorType.Other;
        }
    }
}

public enum DeviceFormFactorType
{
    Phone,
    Desktop,
    Tablet,
    IoT,
    SurfaceHub,
    Other
}
    public VideoPage()
    {
        this.InitializeComponent();
        if (GetDeviceFormFactorType() == DeviceFormFactorType.Phone)
        {
            VideoContent.MaxWidth = 250;
        }
    }