ListView未在UWP中调整大小

时间:2016-02-25 12:14:28

标签: c# xaml win-universal-app windows-10-universal

我有这样的列表视图。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ListView ItemsSource="{x:Bind announcements}" IsItemClickEnabled="True" ItemClick="Announcement_ItemClick">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="data:Announcement">
                <StackPanel Orientation="Horizontal" Margin="0,20,0,0">
                    <StackPanel Height="Auto" Orientation="Vertical" Width="Auto">
                        <TextBlock Text="{x:Bind dates}" FontWeight="Bold"/>
                        <TextBlock Height="Auto" Text="{x:Bind titles}" Margin="0,6,0,0" TextWrapping="WrapWholeWords"/>
                    </StackPanel>
                    <StackPanel VerticalAlignment="Center">
                        <SymbolIcon Symbol="Download" Margin="20,0,0,0" Visibility="{x:Bind visibility}"/>
                    </StackPanel>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

问题是如果我在主堆栈面板内有两个堆栈面板,则如果宽度发生变化,listview不会调整大小。所以我无法在这些文本框中看到文本。

enter image description here

但如果我删除放置了symbolicon的stackpanel,则会进行大小调整。 没有第二个堆栈面板的listview代码。

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <ListView ItemsSource="{x:Bind announcements}" IsItemClickEnabled="True" ItemClick="Announcement_ItemClick">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="data:Announcement">
                    <StackPanel Height="Auto" Margin="0,20,0,0" Orientation="Vertical" Width="Auto">
                        <TextBlock Text="{x:Bind dates}" FontWeight="Bold"/>
                        <TextBlock Height="Auto" Text="{x:Bind titles}" Margin="0,6,0,0" TextWrapping="WrapWholeWords"/>
                    </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

enter image description here

是否可以使文本框中的文本也显示在我的第二个堆栈面板中的下载图标中。我只想在项目的右侧显示下载图标。有没有办法实现这个?对不起,问题很长。

2 个答案:

答案 0 :(得分:3)

问题来自您的第一个水平堆栈面板。它基本上表示儿童控制的布局没有任何限制,所以它将自己调整大小以适应你的长文本。 您可以使用更多&#34; strict&#34;来限制此操作。布局,将您的项目宽度限制为列表视图宽度。

您可以使用网格强制子控件保留在父边界内,而不是使用灵活的StackPanel。

<ListView.ItemTemplate>
 <DataTemplate x:DataType="local:Announcement">

 <Grid Margin="0,20,0,0" >**
   <Grid.ColumnDefinitions>
     <ColumnDefinition Width="*" />
     <ColumnDefinition Width="Auto" />
   </Grid.ColumnDefinitions>

   <StackPanel Height="Auto" Orientation="Vertical" Width="Auto">
     <TextBlock Text="{x:Bind dates}" FontWeight="Bold"/>
     <TextBlock Height="Auto" Text="{x:Bind titles}" Margin="0,6,0,0" TextWrapping="WrapWholeWords"/>
   </StackPanel>

   <StackPanel VerticalAlignment="Center" Grid.Column="1">
     <SymbolIcon Symbol="Download" Margin="20,0,0,0" Visibility="{x:Bind visibility}"/>
   </StackPanel>
 </Grid>
</DataTemplate>
</ListView.ItemTemplate>

这将为您提供以下内容: layout result

您还可以通过更改ItemContainerStyle强制下载按钮向右对齐。我们请求列表视图项在列表视图中拉伸。默认为左对齐。

<ListView.ItemContainerStyle>
  <Style TargetType="ListViewItem">
    <Setter Property="HorizontalAlignment" Value="Stretch" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
  </Style>
</ListView.ItemContainerStyle>

enter image description here

答案 1 :(得分:0)

尝试将http://localhost:8080/debug/pprof/goroutine?debug=2 替换为StackPanel

Grid