如何在GroupBox框架上垂直对齐项目 [英] How do I verticaly align items on GroupBox frame

问题描述

我想在不使用边距和填充的情况下正确地垂直对齐groupbox框架上的项目。结果应如下图所示： http://up.picr.de/17284729tf.png [ ^ ]我不想计算像素数。当我使用

I would like to proper vertical align the items at the groupbox frame without using margin and padding. The result should look like this picture: http://up.picr.de/17284729tf.png[^] I doun't like to count the pixels. When I'm using

VerticalAlignment="Center"

它取决于窗框。有办法吗？

it centers depending at the window frame. Is there a way to do this?

<UserControl x:Class="Automation.View.ControlWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             Height="Auto" Width="Auto">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <GroupBox Grid.ColumnSpan="2">
            <GroupBox.Header>Control</GroupBox.Header>
        </GroupBox>
        <StackPanel Grid.Column="0" Orientation="Horizontal" HorizontalAlignment="Left">
            <Label  Content="Cycle count:" VerticalAlignment="Center"></Label>
            <TextBox x:Name="cycleCount"  Width="25" Height="24" TextAlignment="Center" VerticalAlignment="Center">1</TextBox>
            <StackPanel Grid.Column="0" VerticalAlignment="Center">
                <Button x:Name="cycleCountUp" Content="▲" VerticalAlignment="Bottom" FontSize="6"/>
                <Button x:Name="cycleCountDown" Content="▼" VerticalAlignment="Top" FontSize="6"/>
            </StackPanel>
        </StackPanel>
        <StackPanel Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Right" >
            <Button Width="75" Height="24" Margin="5" Click="Button_Click">Continue</Button>
            <Button Width="75" Height="24" Margin="5">Restart</Button>
        </StackPanel>

    </Grid>
</UserControl>

推荐答案

您好matlab22，



您没有为您的组框指定任何内容。使用StackPanel作为Content-Container，然后添加子堆栈面板

Hi matlab22,

You didn't specify any Content for your groupbox. Use a StackPanel as Content-Container then add your sub-stackpanels

<groupbox grid.columnspan="2">
     <groupbox.header>Control</groupbox.header>
     <stackpanel>
         <stackpanel grid.column="0" orientation="Horizontal" horizontalalignment="Left"></stackpanel></stackpanel></groupbox>

顺便说一句。设置保证金没有错 - 可能是通过一种风格？你不算数字像素，但设备单位;-)



如果你不明白我的意思或需要进一步的帮助，请随时问...



亲切的问候



Johannes

btw. nothing wrong to set the margin - maybe through a style? And you are not counting pixels but "device units" ;-)

If you don't understand what I mean or need further help, feel free to ask..

Kind regards

Johannes

我错过了这个：S $ / $

Thx i missed this :S

<grid>
    <groupbox>
        <groupbox.header>Control</groupbox.header>
        <grid>

            <grid.columndefinitions>
                <columndefinition width="Auto" />
                <columndefinition width="*" />
            </grid.columndefinitions>

            <stackpanel grid.column="0" orientation="Horizontal" horizontalalignment="Left">
                <Label  Content="Cycle count:" VerticalAlignment="Center"></Label>
                <textbox x:name="cycleCount" width="25" height="24" textalignment="Center" verticalalignment="Center" xmlns:x="#unknown">1</textbox>
                <stackpanel verticalalignment="Center">
                    <Button x:Name="cycleCountUp" Content="▲" VerticalAlignment="Bottom" FontSize="6"/>
                    <Button x:Name="cycleCountDown" Content="▼" VerticalAlignment="Top" FontSize="6"/>
                </stackpanel>
            </stackpanel>

            <stackpanel grid.column="1" orientation="Horizontal" horizontalalignment="Right">
                <Button x:Name="continue_pause"  Width="75" Margin="5" Click="continue_pause_Click">Continue</Button>
                <Button x:Name="restart_stop" Width="75" Margin="5" Click="restart_stop_Click">Restart</Button>
            </stackpanel>

        </grid>
    </groupbox>
</grid>

这篇关于如何在GroupBox框架上垂直对齐项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！