0

我正在使用水平ListBox(可能有更好的方法)制作一种导航栏,原因是我需要一次只能选择一个东西,并让它保持选中状态,然后才能取消选择它。因此,为了完成这项工作,我使用了ToggleButton.

问题是,我“拉伸”内容以适合框,以便我可以单击选择区域中的任意位置以使用切换按钮取消选择。

我的问题是我的按钮现在由于拉伸而顶部对齐,是否可以在使用拉伸时将它们垂直居中?每当我尝试将它们同时居中时,它都会让我回到方形按钮本身再次缩小到中心的位置。

<ListBox Grid.Row="0" Grid.Column="0" ItemsSource="{Binding PageViewModels}" SelectedItem="{Binding CurrentPageViewModel}" Style="{StaticResource MenuStyle}">
        <ListBox.ItemContainerStyle>
            <Style TargetType="{x:Type ListBoxItem}">
                <Setter Property="Padding" Value="0"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Border Background="{TemplateBinding Background}">
                                <ContentPresenter />
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Background" Value="#FCCC"/>
                                </Trigger>
                                <Trigger Property="IsSelected" Value="True">
                                    <Setter Property="Background" Value="#FAAA"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListBox.ItemContainerStyle>

        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                <ToggleButton VerticalAlignment="Stretch"
                            Content="{Binding Name}"
                            IsChecked="{Binding IsSelected, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}"
                            Style="{StaticResource BlankButtonStyle}"
                            />
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

这可能是一个非常愚蠢的问题,但它真的困扰着我,我有点卡住了。

4

2 回答 2

1

您可以使用 VerticalContentAlignment 属性。

<Style TargetType="{x:Type ListBoxItem}">
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    ...
于 2013-10-01T23:57:41.680 回答
1

所以我可以通过简单地将 TextBlock 添加到 ListItem 模板来解决这个问题。

我可以将现在空白的 ToggleButton 拉伸到 ListItem 的完整大小,然后使用 TextBlock 居中/执行任何操作。

这不是一个理想的实现,但它是我目前能想到的最好的实现。

<ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
            <TextBlock Text="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Center" />
            <ToggleButton VerticalAlignment="Stretch"
                        Content=""
                        IsChecked="{Binding IsSelected, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}"
                        Style="{StaticResource BlankButtonStyle}"
                        />
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
于 2013-10-02T14:05:36.940 回答