Лучшая практика WPF для окна DataEntry - PullRequest
16 голосов
/ 25 ноября 2008

В настоящее время я играю с WPF, и теперь мне интересно, какой будет компоновка для типичного окна ввода данных (20+ текстовых полей и прочее).

атм. Я использую такой объект сетки (базовый пример)

    <Grid Margin="2,2,2,2">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions >
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="Auto"></RowDefinition>
        </Grid.RowDefinitions>

            <Label Grid.Row="0" Grid.Column="0">Vorname:</Label>
            <TextBox Grid.Row="0" Grid.Column="1" Text="{Binding Path=Surname, UpdateSourceTrigger=PropertyChanged}" ></TextBox>

            <Label Grid.Row="1" Grid.Column="0">Nachname:</Label>
            <TextBox Grid.Row="1" Grid.Column="1" Text="{Binding Path=ChristianName, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="2" Grid.Column="0">Strasse (Wohnsitz):</Label>
            <TextBox Grid.Row="2" Grid.Column="1" Text="{Binding Path=Street1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="3" Grid.Column="0">Ort (Wohnsitz):</Label>
            <TextBox Grid.Row="3" Grid.Column="1" Text="{Binding Path=Town1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="4" Grid.Column="0">Postleitzahl (Wohnsitz):</Label>
            <TextBox Grid.Row="4" Grid.Column="1" Text="{Binding Path=PostalCode1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="5" Grid.Column="0">Bundesland (Wohnsitz):</Label>
            <TextBox Grid.Row="5" Grid.Column="1" Text="{Binding Path=State1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="6" Grid.Column="0">Land (Wohnsitz):</Label>
            <TextBox Grid.Row="6" Grid.Column="1" Text="{Binding Path=Country1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

            <Label Grid.Row="7" Grid.Column="0">Zusatz (Wohnsitz):</Label>
            <TextBox Grid.Row="7" Grid.Column="1" Text="{Binding Path=AdditionalAdrInfo1, UpdateSourceTrigger=PropertyChanged}"></TextBox>

    </Grid>

в основном это удовлетворяет все мои требования к макету, но что, если я хочу что-то изменить, например, добавить новое текстовое поле в строке 3?

В настоящее время я должен изменить каждое свойство Grid.Row больше 3, но это не может быть предполагаемым способом WPF !?

как другие размещают сложные окна ввода данных?

1012 * ТИА *

Ответы [ 4 ]

5 голосов
/ 25 ноября 2008

Лично я большой поклонник AutoGrid: http://www.codeplex.com/wpfcontrib/Wiki/View.aspx?title=AutoGrid&referringTitle=Home

3 голосов
/ 25 ноября 2008

Некоторые люди используют вложенные StackPanel s для «решения» этой проблемы, но ИМХО это просто создает другую проблему (раздувание кода). Я думаю, что лучший способ решить эту проблему - написать свою собственную панель, которая последовательно размещает детей в столбцах. Я сделал это на предыдущем проекте, и у него есть ряд преимуществ:

  • Более читаемый и краткий XAML
  • Проще поддерживать XAML
  • Быстрее производительность

Использование выглядело примерно так:

<local:FieldPanel>
    <Label>Field 1:</Label>
    <TextBox/>

    <Label>Field 2:</Label>
    <TextBox/>

    <Label>Field 3:</Label>
    <TextBox/>
</local:FieldPanel>
2 голосов
/ 25 ноября 2008

Карл Шиффлетт также имеет хороший подход к LOB-формам в WPF: http://karlshifflett.wordpress.com/2008/10/23/wpf-silverlight-lob-form-layout-searching-for-a-better-solution/

1 голос
/ 16 апреля 2010

Вот еще один макет формы http://www.slideshare.net/ackava/ui-atoms-form-layout

...