Joy Hyuk Lee
Joy Hyuk Lee

Reputation: 776

How can i sort wpf textboxes straight?

I'm design a simple login window and i'm very wondering about this.

Well, this is my XAML code

<Grid ShowGridLines="False">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <DockPanel Grid.Row="0">
        <Label x:Name="label_ID" Height="30"/>
        <TextBox x:Name="textBox_ID" Height="20" TabIndex="0">
            <TextBox.Margin>
                <Thickness Right="5"/>
            </TextBox.Margin>
        </TextBox>
    </DockPanel>
    <DockPanel Grid.Row="1">
        <Label x:Name="label_PW" Height="30"/>
        <PasswordBox x:Name="textBox_PW" Height="20" TabIndex="1">
            <PasswordBox.Margin>
                <Thickness Right="5"/>
            </PasswordBox.Margin>
        </PasswordBox>
    </DockPanel>
    <DockPanel Grid.Row="2">
        <Label x:Name="label_IP" Height="30"/>
        <TextBox x:Name="textBox_IP" Height="20" UndoLimit="2">
            <TextBox.Margin>
                <Thickness Right="5"/>
            </TextBox.Margin>
        </TextBox>
    </DockPanel>
</Grid>

label_ID's string is ID label_PW's string is Password label_IP's string is 'IP'

And the output is like this:

https://www.dropbox.com/s/k23ft06layp0sl4/1.PNG?dl=0

The password text box only short then other. (I want to short another text boxes to.)

How can i fix location of text boxes?

Thanks.

Upvotes: 1

Views: 325

Answers (3)

RonaldMunodawafa
RonaldMunodawafa

Reputation: 223

Right now I can only think of using the margin property as in:

<UIElement Margin="left, top, right, bottom" />
<Menu Name="EgMenu"
      Margin="20,20,0,20" />

The margin property will help you position and size your UI elements in an easiser way thatt youy can visualise just looking at the text. But why not use WYSIWYG and, refine by editting XAML later.

Upvotes: 0

qqbenq
qqbenq

Reputation: 10460

I think your DockPanels are not really needed, instead you could use two columns in the Grid:

<Grid ShowGridLines="False">
     <Grid.ColumnDefinitions>
         <ColumnDefinition Width="Auto"/>
         <ColumnDefinition Width="*"/>
     </Grid.ColumnDefinitions>
     <Grid.RowDefinitions>
         <RowDefinition Height="Auto"/>
         <RowDefinition Height="Auto"/>
         <RowDefinition Height="Auto"/>
     </Grid.RowDefinitions>

     <Label Grid.Row="0" Grid.Column="0" x:Name="label_ID" Height="30"/> 
     <TextBox Grid.Row="0" Grid.Column="1" x:Name="textBox_ID" Height="20" TabIndex="0" Margin="5"/>

     <Label Grid.Row="1" Grid.Column="0" x:Name="label_PW" Height="30"/>
     <PasswordBox Grid.Row="1" Grid.Column="1" x:Name="textBox_PW" Height="20" TabIndex="1" Margin="5"/>

     <Label Grid.Row="2" Grid.Column="0" x:Name="label_IP" Height="30"/> 
     <TextBox Grid.Row="2" Grid.Column="1" x:Name="textBox_IP" Height="20" UndoLimit="2"  Margin="5"/>
</Grid>

Setting the first column's width to Auto ensures that the text will be visible, the second column will take the rest of the space (*).

It produces an output like this (with some test strings added by me):

output

Upvotes: 2

Imran Hasan
Imran Hasan

Reputation: 21

Simplest way I could think of is

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="200" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
        <RowDefinition Height="30" />
    </Grid.RowDefinitions>
    <Label Name="lblID" Content="ID:" HorizontalAlignment="Right" VerticalAlignment="Center" Width="Auto" Margin="5,2,5,2" />
    <TextBox Name="txtID" HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="1" Grid.Row="0" Margin="5,2,0,2" Width="250" Height="25" />
    <Label Name="lblPwd" Content="Password:" HorizontalAlignment="Right" VerticalAlignment="Center" Width="Auto" Grid.Column="0" Grid.Row="1" Margin="5,2,5,2" />
    <PasswordBox Name="pwdBx" HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="1" Grid.Row="1" Margin="5,2,0,2" Width="250" Height="25" />
    <Label Name="lblIP" Content="IP:" HorizontalAlignment="Right" VerticalAlignment="Center" Width="Auto" Grid.Column="0" Grid.Row="2" Margin="5,2,5,2" />
    <TextBox Name="txtIP" HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="1" Grid.Row="2" Margin="5,2,0,2" Width="250" Height="25" />
</Grid>

Upvotes: 1

Related Questions