如何为 UWP 调整 Telerik UI 的 listviewitem 容器的高度

Posted 2023-04-13

【中文标题】如何为 UWP 调整 Telerik UI 的 listviewitem 容器的高度

【英文标题】：How to resize the container's height of listviewitem of Telerik UI for UWP

【发布时间】：2017-07-06 20:34:13

【问题描述】：

这是我第一次将 Telerik UI 用于 UWP。 我将列表视图添加到 xaml：

<telerikDataControls:RadListView x:Name="rlvProducts" Grid.Row="1" IsCheckModeActive="True" FontSize="12">
<telerikDataControls:RadListView.ItemTemplate>
    <DataTemplate >
        <TextBlock Text="Binding" VerticalAlignment="Center" HorizontalAlignment="Left"/>
    </DataTemplate>
</telerikDataControls:RadListView.ItemTemplate>

我得到这样的列表视图：

可以看到item的高度太大了。

我尝试重新设置字体大小、模板文本块的高度，但没有成功。

谁能告诉我如何调整listviewitem的高度？ 非常感谢。

【参考方案1】：

您可以应用自定义RadListViewItem 样式，如下所示：

<data:RadListView>
    <data:RadListView.ItemTemplate>
        <DataTemplate>
            <TextBlock ... />
        </DataTemplate>
    </data:RadListView.ItemTemplate>
    <data:RadListView.ItemStyle>
        <Style TargetType="listView:RadListViewItem">
            <Setter Property="VerticalAlignment" Value="Center" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="MinHeight" Value="0" />
            <Setter Property="Padding" Value="0" />
        </Style>
    </data:RadListView.ItemStyle>
</data:RadListView>

您当然可以进一步调整Style 以满足您的需求。

有关 ItemStyling 的更多信息，包括 ItemSwipe 样式，see this article。

【参考方案2】：

您可以在项目模板中使用<fieldset>标签来控制它，例如：

 <telerikDataControls:RadListView x:Name="rlvProducts" Grid.Row="1" IsCheckModeActive="True" FontSize="12">
  <telerikDataControls:RadListView.ItemTemplate>
    <fieldset  style="float: left; width: 350px; height: 150px;/>
    <DataTemplate >... </DataTemplate>
  </telerikDataControls:RadListView.ItemTemplate>
</telerikDataControls:RadListView>

更多详情请看这里：doc

【讨论】：

感谢您的回答。等我回去工作的时候试试。?

我检查了代码和文档，但它对我不起作用。该文档适用于 RadListView for ASP.NET AJAX 而不是 UWP。