0

Есть 3 TextBox "в столбик", нужно, чтобы их было 6 (3 столбца)

Вопрос: как организовать второй и третий столбик, чтобы расстояние между каждым было 20px?

<StackPanel>
    <!--First Colomn-->
    <Border Padding="20 120 630 290">
        <StackPanel>
            <TextBox Padding="2"/>
        </StackPanel>
    </Border>
    <Border Padding="20 150 630 260">
        <StackPanel>
            <TextBox Padding="2"/>
        </StackPanel>
    </Border>
    <Border Padding="20 180 630 230">
        <StackPanel>
            <TextBox Padding="2"/>
        </StackPanel>
    </Border>
</StackPanel>
3
  • 4
    Padding="20 120 630 290" - не когда не передвигайте элементы руками, пишите эти цифры сами (иначе в скором времени будете задавать вопросы "почему я не вижу элемент" или "у меня скачет вся разметка"). Не должно быть как по мне выше 10-20 отступов. А по вопросу - используйте Grid, создавайте в нем сколько вашей душе угодно столбиков и размещайте элементы.
    – EvgeniyZ
    14 мар 2018 в 19:59
  • 2
    @EvgeniyZ почему не как ответ? ;)
    – user227049
    14 мар 2018 в 21:22
  • @FoggyFinder Как скажете)
    – EvgeniyZ
    14 мар 2018 в 22:16

1 ответ 1

5

Давайте для начала пройдёмся по тому, что вы написали, ваша разметка...

  1. У вас очень много лишних элементов. Вы делаете <StackPanel>, в ней делаете кучу <Border>, внутри делаете ещё один <StackPanel> и уж затем у вас идёт необходимый элемент <TextBox>. Зачем вы так все это завернули?

  2. Вы видели то, что у вас пишется в Padding? У вас везде стоит Padding="20 180 630 230" что категорически нельзя делать! Вы к примеру измените размер окна, часть элементов выйдут за границы, добавите ещё какие то элементы, тоже может все съехать. Вы объекты загоняете в дикие рамки и грубо говоря "прибиваете их гвоздями" к вашему окну. Дайте им свободы, укажите один объект, к примеру <Grid>, ему укажите нужные поля да колонки, внутри этого <Grid> размещайте по нужным местам другие элементы, к примеру и ему указывайте положение в конкретно этой ячейке (верх, низ, право, лево), делаете отступы (ну прям максимум 20, не делайте их 600-1000) и все у вас будет работать как надо! P.S. Отступы такие обычно делает сама студия, если вы двигаете объекты руками в конструкторе, не делайте этого не в коем случае и поберегите свои нервы.

Как должна выглядеть более менее правильная разметка:

<Grid>
    <!-- Создаем 3 ряда одинакового размера -->
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>

    <!-- Создаем 3 столбца одинакового размера -->
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>

    <!-- Размещаем объекты -->
    <TextBox Grid.Row="0" Grid.Column="0" Margin="10,0" Text="MyText 1" VerticalAlignment="Center" />
    <TextBox Grid.Row="1" Grid.Column="0" Margin="10,0" Text="MyText 2" VerticalAlignment="Center" />
    <TextBox Grid.Row="2" Grid.Column="0" Margin="10,0" Text="MyText 3" VerticalAlignment="Center" />
    <TextBox Grid.Row="0" Grid.Column="1" Margin="10,0" Text="MyText 4" VerticalAlignment="Center" />
    <TextBox Grid.Row="1" Grid.Column="1" Margin="10,0" Text="MyText 5" VerticalAlignment="Center" />
    <TextBox Grid.Row="2" Grid.Column="1" Margin="10,0" Text="MyText 6" VerticalAlignment="Center" />
    <TextBox Grid.Row="0" Grid.Column="2" Margin="10,0" Text="MyText 7" VerticalAlignment="Center" />
    <TextBox Grid.Row="1" Grid.Column="2" Margin="10,0" Text="MyText 8" VerticalAlignment="Center" />
    <TextBox Grid.Row="2" Grid.Column="2" Margin="10,0" Text="MyText 9" VerticalAlignment="Center" />
</Grid>

В итоге у нас выйдет что то вроде этого (если смотреть через конструктор):

Result

И заметьте, при изменение окна у вас не будет нечего слетать, давайте объектам чёткие указания того, где он должен находится с помощью VerticalAlignment и HorizontalAlignment, задавайте минимальные отступы от того положения, где он находится и будет вам счастье. Надеюсь смог растолковать все. Удачи!

1
  • 1
    Если нужны одинаковые клетки - можно использовать UniformGrid 15 мар 2018 в 3:32

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.