ListView 在 TabItem 中不会显示答案

【问题标题】：ListView won't show up while in TabItemListView 在 TabItem 中不会显示
【发布时间】：2015-04-13 00:18:25
【问题描述】：

好的，所以我正在尝试制作这个应用程序，我希望在不同的选项卡上显示不同的内容。

我创建了一个选项卡控件，我有“地图视图”和“文本视图”。我还没有开始使用 Map View，所以它目前是空的。 “文本视图”应该有一个 ListView 和一个 WebBrowser。

在使用选项卡之前，我在应用程序中有这些项目，它们显示出来并且工作得很好。但是现在我试图将它们放在 TabItem 中，无论我做什么，ListView 都不会显示。

WebBrowser 显示正常，但 ListView 尽管多次尝试将其置于最前面，但仍不会显示。它不会出现在设计屏幕中，也不会在程序运行时显示。我可以选择它，如果我将 XAML 复制粘贴到页面的另一部分（不再位于 TabControl 内），它就会再次完全可见。我完全不知道为什么会这样，现在已经尝试了一个多小时。

    <Grid HorizontalAlignment="Left" Height="506" Margin="278,46,0,0"     VerticalAlignment="Top" Width="753" x:Name="TextMapGrid" Background="#FFEEE1E1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TabControl HorizontalAlignment="Left" Height="21" Margin="-1,-21,0,0" VerticalAlignment="Top" Width="136">
            <TabItem Header="Text View">
                <Grid Background="#FFE5E5E5">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <WebBrowser x:Name="RSSWeb" HorizontalAlignment="Left" Height="363" VerticalAlignment="Top" Width="746" Margin="0,135,-620,-498" Grid.ColumnSpan="2"/>
                    <ListView x:Name="RSSList" HorizontalAlignment="Left" Height="121" VerticalAlignment="Top" Width="746" MouseLeftButtonUp="RSSList_MouseLeftButtonUp" Margin="0,-1,-620,-120" Background="White" Grid.ColumnSpan="2">
                        <ListView.View>
                            <GridView>
                                <GridViewColumn Header="Read" Width="50" DisplayMemberBinding="{Binding Read}"/>
                                <GridViewColumn Header="Title" Width="300" DisplayMemberBinding="{Binding Title}"/>
                                <GridViewColumn Header="Date" Width="110" DisplayMemberBinding="{Binding Date}"/>
                                <GridViewColumn Header="Link" Width="343" DisplayMemberBinding="{Binding URL}"/>
                            </GridView>
                        </ListView.View>
                    </ListView>

                </Grid>
            </TabItem>
            <TabItem Header="Map View" Margin="-2,-2,-2,-1">
                <Grid Background="#FFE5E5E5">

                </Grid>
            </TabItem>
        </TabControl>

    </Grid>

【问题讨论】：

标签： c# wpf listview tabcontrol tabitem

【解决方案1】：

您将列表视图和网络浏览器都放在一个单元格网格中。此外，删除列表视图和网络浏览器上的 Margin 和 Grid.Columnspan 属性。

您可以将它们包装在 StackPanel 中，例如

<StackPanel>
    <ListView x:Name="RSSList" HorizontalAlignment="Left" Height="121" VerticalAlignment="Top" Width="746" MouseLeftButtonUp="RSSList_MouseLeftButtonUp" Margin="0,-1,-620,-120" Background="White" Grid.ColumnSpan="2">
        <ListView.View>
            <GridView>
                <GridViewColumn Header="Read" Width="50" DisplayMemberBinding="{Binding Read}"/>
                <GridViewColumn Header="Title" Width="300" DisplayMemberBinding="{Binding Title}"/>
                <GridViewColumn Header="Date" Width="110" DisplayMemberBinding="{Binding Date}"/>
                <GridViewColumn Header="Link" Width="343" DisplayMemberBinding="{Binding URL}"/>
            </GridView>
        </ListView.View>
    </ListView>
    <WebBrowser x:Name="RSSWeb" HorizontalAlignment="Left" Height="363" VerticalAlignment="Top" Width="746" Margin="0,135,-620,-498" Grid.ColumnSpan="2"/>
</StackPanel>

或将行定义添加到您的网格并将它们分配给自己的行。

<Grid Background="#FFE5E5E5">
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <WebBrowser Grid.Row="1" ... Rest of code omitted for brevity />
    <ListView Grid.Row="0" ...Rest of code omitted for brevity />
</Grid>

编辑：演示该概念有效的简单示例。您可以创建一个新的窗口/用户控件并尝试下面的代码示例。

<Grid>
    <TabControl>
        <TabItem Header="Stack Panel example">
            <StackPanel>
                <TextBlock Text="ListView" />
                <ListView Height="100" Margin="2"/>
                <TextBlock Text="Web Browser" />
                <WebBrowser Height="100" Margin="2" />
            </StackPanel>
        </TabItem>
        <TabItem Header="Grid example">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <ListView Grid.Row="0" Height="100" Margin="2"/>
                <WebBrowser Grid.Row="1" Height="100" Margin="2"/>
            </Grid>
        </TabItem>
    </TabControl>
</Grid>

【讨论】：

这些都不起作用。将 WebBrowser 置于 ListView 下方也不起作用。此外，将 ListView 本身放在第二个选项卡项（Header="Map View" one）上仍然没有显示 ListView。因此，单独在自己的网格上仍然没有显示出来。
您是否删除了 ListView 和 WebBrowser 上的 Margin 属性？
供参考，这是整个应用程序的图片。右上角的空白灰色区域是 ListView 应该显示的位置。它下面的白框是仍然显示的 WebBrowser。 i.imgur.com/CDDegas.jpg
我没有删除边距。编辑：当我删除它们时，网络浏览器移动到 tabitem 网格的顶部，现在与列表视图重叠。
我已经编辑了代码示例以将 WebBrowser 移动到 ListView 下方。我还提供了一个简单的示例来向您展示这个概念确实有效。使用 WPF，您真的不应该使用边距来定位控件元素。您应该使用容器来控制布局。