调整大小时WPF中的控件粘在一起

时间:2015-04-05 10:30:44

标签: c# wpf user-controls

您好我是WPF中的新手,我在设计UI方面遇到了一些问题。

在设计视图中,我有这个: http://i.stack.imgur.com/papJ2.png

这是我的XAML代码:

<mui:ModernWindow
                  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                  xmlns:mui="http://firstfloorsoftware.com/ModernUI"
                  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:awe="http://schemas.awesomium.com/winfx" x:Name="___No_Name_" mc:Ignorable="d" x:Class="JJADesign.MainWindow"
                  Title="mui" 
                  LogoData="F1 M 24.9015,43.0378L 25.0963,43.4298C 26.1685,49.5853 31.5377,54.2651 38,54.2651C 44.4623,54.2651 49.8315,49.5854 50.9037,43.4299L 51.0985,43.0379C 51.0985,40.7643 52.6921,39.2955 54.9656,39.2955C 56.9428,39.2955 58.1863,41.1792 58.5833,43.0379C 57.6384,52.7654 47.9756,61.75 38,61.75C 28.0244,61.75 18.3616,52.7654 17.4167,43.0378C 17.8137,41.1792 19.0572,39.2954 21.0344,39.2954C 23.3079,39.2954 24.9015,40.7643 24.9015,43.0378 Z M 26.7727,20.5833C 29.8731,20.5833 32.3864,23.0966 32.3864,26.197C 32.3864,29.2973 29.8731,31.8106 26.7727,31.8106C 23.6724,31.8106 21.1591,29.2973 21.1591,26.197C 21.1591,23.0966 23.6724,20.5833 26.7727,20.5833 Z M 49.2273,20.5833C 52.3276,20.5833 54.8409,23.0966 54.8409,26.197C 54.8409,29.2973 52.3276,31.8106 49.2273,31.8106C 46.127,31.8106 43.6136,29.2973 43.6136,26.197C 43.6136,23.0966 46.127,20.5833 49.2273,20.5833 Z"
                  Style="{StaticResource BlankWindow}" d:DesignHeight="1055" d:DesignWidth="1400" WindowStartupLocation="CenterScreen" WindowStyle="SingleBorderWindow">
    <DockPanel>
        <TabControl DockPanel.Dock="Top" Height="69">
            <TabItem Header="TabItem">
                <Grid Margin="0,0,0,1">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="225*"/>
                        <ColumnDefinition Width="466*"/>
                    </Grid.ColumnDefinitions>
                    <TextBox HorizontalAlignment="Left" Height="23" Margin="147,4,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="218"/>
                    <Button Content="Button" HorizontalAlignment="Left" Margin="95,3,0,0" VerticalAlignment="Top" Width="170" Grid.Column="1"/>
                    <Button Content="Button" HorizontalAlignment="Left" Margin="370,3,0,0" VerticalAlignment="Top" Width="170" Grid.ColumnSpan="2"/>
                    <Label Content="Saisir une produit JJA" HorizontalAlignment="Left" Width="100" Margin="15,7,335,5" />

                </Grid>

            </TabItem>
            <TabItem Header="TabItem">
                <Grid >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="15*"/>
                        <ColumnDefinition Width="676*"/>
                    </Grid.ColumnDefinitions>
                </Grid>
            </TabItem>
        </TabControl>
        <awe:WebControl DockPanel.Dock="Bottom" Source="http://www.google.com/"/>
    </DockPanel>
</mui:ModernWindow>

但是当我运行我的应用程序时,我得到了这个:

正常:

http://i.stack.imgur.com/IH300.png

如何让控件不粘在一起?

1 个答案:

答案 0 :(得分:1)

选项卡中的项目分组为<grid>,但是使用绝对边距将它们放置在网格中。 尝试在其内部的项目上使用带有边距的stackpanel,如下所示:

<TabItem Header="TabItem">
            <StackPanel Orientation="Horizontal" Margin="0,0,0,1">
                    <TextBox HorizontalAlignment="Left" Height="23" margin="0,0,10,0"  TextWrapping="Wrap" Text="TextBox"  Width="218"/>
                    <Button Content="Button" margin="0,0,10,0" Width="170" />
                    <Button Content="Button" margin="0,0,10,0"  Width="170" />
                    <Label Content="Saisir une produit JJA"  Width="100"  />    
            </StackPanel>
</TabItem>