ComboBox模板内的弹出坐标

本文关键字:坐标 ComboBox | 更新日期: 2023-09-27 18:02:42

我想创建一个下拉框或弹出框右对齐的组合框,在组合框的右侧没有足够的空间。

我可以把它的FlowDirection设置为右对齐,但我需要知道什么时候右对齐。所以我试图通过使用它的x坐标(相对于RootVisual)加上它的宽度来计算弹出窗口的右边缘。如果它的右边缘的值大于RootVisual的宽度,那么组合框需要右对齐,它是弹出或下拉。

现在我的问题是,它看起来对我来说,弹出框继承了ComboBox的坐标。为什么我得到不正确的坐标弹出?是因为Popup包含在ComboBox的模板中吗?这是我的示例代码…

ComboBox的简化模板…

<Style TargetType="local:CustomComboBox">
    <Setter Property="Padding" Value="6,2,25,2"/>
    <Setter Property="Background" Value="#FF1F3B53"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="TabNavigation" Value="Once"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="BorderBrush">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFA3AEB9" Offset="0"/>
                <GradientStop Color="#FF8399A9" Offset="0.375"/>
                <GradientStop Color="#FF718597" Offset="0.375"/>
                <GradientStop Color="#FF617584" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:CustomComboBox">
                <Grid>
                    <Border x:Name="ContentPresenterBorder">
                        <Grid>
                            <ToggleButton x:Name="DropDownToggle" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="0" Style="{StaticResource comboToggleStyle}" VerticalAlignment="Stretch">
                                <Path x:Name="BtnArrow" Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z " HorizontalAlignment="Right" Height="4" Margin="0,0,6,0" Stretch="Uniform" Width="8">
                                    <Path.Fill>
                                        <SolidColorBrush x:Name="BtnArrowColor" Color="#FF333333"/>
                                    </Path.Fill>
                                </Path>
                            </ToggleButton>
                            <ContentPresenter x:Name="ContentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                <TextBlock Text=" "/>
                            </ContentPresenter>
                        </Grid>
                    </Border>
                    <Popup x:Name="Popup">
                        <Border x:Name="PopupBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3" HorizontalAlignment="Stretch" Height="Auto">
                            <Border.Background>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="#FFFFFFFF" Offset="0"/>
                                    <GradientStop Color="#FFFEFEFE" Offset="1"/>
                                </LinearGradientBrush>
                            </Border.Background>
                            <ScrollViewer x:Name="ScrollViewer" BorderThickness="0" Padding="1">
                                <ItemsPresenter/>
                            </ScrollViewer>
                        </Border>
                    </Popup>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Control's code behind…

public class CustomComboBox : ComboBox
{
    private Popup _popup;
    private ScrollViewer _scrollViewer;
    public CustomComboBox()
    {
        this.DefaultStyleKey = typeof(CustomComboBox);
    }
    protected override void OnDropDownOpened(EventArgs e)
    {
        GeneralTransform gt = _popup.TransformToVisual(App.Current.RootVisual as UIElement);
        Point popupOffset = gt.Transform(new Point(0, 0));
        double popupRightEdge = popupOffset.X + _popup.ActualWidth;
        double appRightEdge = (App.Current.RootVisual as FrameworkElement).ActualWidth;
        if (popupRightEdge > appRightEdge)
        {
            _popup.FlowDirection = FlowDirection.RightToLeft;
            _scrollViewer.FlowDirection = FlowDirection.LeftToRight;
        }
        base.OnDropDownOpened(e);
    }
    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        _popup = GetTemplateChild("Popup") as Popup;
        _scrollViewer = GetTemplateChild("ScrollViewer") as ScrollViewer;
    }
}

ComboBox模板内的弹出坐标

ComboBox的ControlTemplate中的validationerroelement导致弹出框右对齐自身而不是实际的ComboBox的右边缘。我建议改变弹出控件的名称,这是"弹出",类似于"DropDownPopup"在ControlTemplate的ComboBox虽然,然后绑定你的弹出的IsOpen属性到ToggleButton的IsChecked属性。弹出窗口是组合框的控制部分,我怀疑有一些代码连接到它,使它的行为方式。

我们使用的Virtualizing StackPanel也提高了性能,但产生了一些其他奇怪的行为。在Virtualizing StackPanel上设置一个固定的宽度可以修复它。在弹出窗口上设置固定宽度也可以解决这个问题。