TOC

This article has been localized into Russian by the community.

Панели:

Использование панели Grid: форма контакта

В последних нескольких главах мы познакомились с большим объемом теоретической информации, и в каждой из глав были некоторые довольно абстрактные примеры. В данной главе мы объединим все что мы выучили о панели Grid в примере, который можно использовать на практике. Простая форма контакта.

Форма контакта удобна тем, что она является примером часто используемого диалогового окна. Соответственно вы можете взять используемые методики и применить их почти ко всем типам диалогов, которые вам понадобиться создать.

Вначале задача совсем простая – создаем основу контактной формы. Она состоит из трех рядов, два из которых имеют высоту типа Auto, а последний – типа «*», т.е. подразумевается, что он займет оставшееся пространство.

<Window x:Class="WpfTutorialSamples.Panels.GridContactForm"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="GridContactForm" Height="300" Width="300">
    <Grid>
		<Grid.RowDefinitions>
			<RowDefinition Height="Auto" />
			<RowDefinition Height="Auto" />
			<RowDefinition Height="*" />
		</Grid.RowDefinitions>		
		<TextBox>Name</TextBox>
		<TextBox Grid.Row="1">E-mail</TextBox>
		<TextBox Grid.Row="2" AcceptsReturn="True">Comment</TextBox>		
	</Grid>
</Window>

Как вы видите, первые два блока TextBox занимают столько места, сколько необходимо, а последний текстовый блок занимает все оставшееся пространство. Попробуйте изменить размеры окна и вы увидите, что размеры блока комментариев “Comment” также будут изменяться.

В этом очень простом примере нет меток для обозначения того, для чего нужно то или иное поле. Вместо этого поясняющий текст помещен прямо в текстовый блок TextBox, однако это не характерно для диалоговых окон Windows. Давайте слегка улучшим вид и полезность окна.

<Window x:Class="WpfTutorialSamples.Panels.GridContactFormTake2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="GridContactFormTake2" Height="300" Width="300">
	<Grid Margin="10">
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="Auto" />
			<ColumnDefinition Width="*" />
		</Grid.ColumnDefinitions>
		<Grid.RowDefinitions>
			<RowDefinition Height="Auto" />
			<RowDefinition Height="Auto" />
			<RowDefinition Height="*" />
		</Grid.RowDefinitions>
		<Label>Name: </Label>
		<TextBox Grid.Column="1" Margin="0,0,0,10" />
		<Label Grid.Row="1">E-mail: </Label>
		<TextBox Grid.Row="1" Grid.Column="1" Margin="0,0,0,10" />
		<Label Grid.Row="2">Comment: </Label>
		<TextBox Grid.Row="2" Grid.Column="1" AcceptsReturn="True" />
	</Grid>
</Window>

Возможно, вы столкнетесь с ситуацией, когда поле комментариев говорит само за себя. В этом случае давайте опустим метку и используем свойство ColumnSpan, чтобы предоставить больше места для текстового блока комментариев.

<TextBox Grid.ColumnSpan="2" Grid.Row="2" AcceptsReturn="True" />

Как вы видите, контейнер Grid является очень полезной панелью. Надеюсь, вы сможете использовать все ее возможности при создании собственных диалоговых окон.

This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!