netbeans.apache.org/src/content/kb/docs/java/gui-gaps_ru.asciidoc - netbeans-website - Git at Google

 //
 //     Licensed to the Apache Software Foundation (ASF) under one
 //     or more contributor license agreements.  See the NOTICE file
 //     distributed with this work for additional information
 //     regarding copyright ownership.  The ASF licenses this file
 //     to you under the Apache License, Version 2.0 (the
 //     "License"); you may not use this file except in compliance
 //     with the License.  You may obtain a copy of the License at
 //
 //       http://www.apache.org/licenses/LICENSE-2.0
 //
 //     Unless required by applicable law or agreed to in writing,
 //     software distributed under the License is distributed on an
 //     "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 //     KIND, either express or implied.  See the License for the
 //     specific language governing permissions and limitations
 //     under the License.
 //

 = Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans
 :jbake-type: tutorial
 :jbake-tags: tutorials
 :jbake-status: published
 :icons: font
 :syntax: true
 :source-highlighter: pygments
 :toc: left
 :toc-title:
 :description: Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans - Apache NetBeans
 :keywords: Apache NetBeans, Tutorials, Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans

 Ян Лагода (Jan Lahoda), Алена Сташкова (Alyona Stashkova)

 Компоновка контейнера в режиме 'Свободное проектирование' состоит из компонентов и промежутков между этими компонентами. И компоненты, и промежутки визуализированы в представлении 'Проектирование' конструктора графического интерфейса пользователя. IDE NetBeans позволяет редактировать промежутки напрямую в конструкторе графического интерфейса пользователя.

 В этом учебном курсе описывается использование редактирования промежутков для вставки новых компонентов пользовательского интерфейса между другими компонентами, а также простое центрирование компонентов вокруг фрейма в конструкторе графического интерфейса пользователя NetBeans без влияния на работу базового диспетчера компоновки. Этот учебный курс разработан как руководство для описания способа выполнения изменений в существующей форме в режиме 'Свободное проектирование' для реализации специальной целевой компоновки, необходимой для проекта.


 image::images/netbeans-stamp-80-74-73.png[title="Содержимое на этой странице применимо к IDE NetBeans 7.2, 7.3, 7.4 и 8.0"]


 *Для работы с этим учебным курсом требуется следующее программное обеспечение и материалы.*

 |===
 |Программное обеспечение или материал |Требуемая версия

 |link:https://netbeans.org/downloads/index.html[+IDE NetBeans+] |7.2, 7.3, 7.4 или 8.0

 |link:http://java.sun.com/javase/downloads/index.jsp[+Комплект для разработчика на языке Java (JDK)+] |Версия 6, 7 или 8

 |link:https://netbeans.org/projects/samples/downloads/download/Samples%252FJava%252FGapSupport.zip[+GapSupport.zip+] |Архив с исходными файлами, содержащими начальную и целевую компоновки учебного курса.
 |===

 *Примечания*

 * Проект, используемый в качестве отправной точки для данного курса, можно загрузить в форме архива  ``.zip`` .
 * В данном руководстве основное внимание уделено созданию структуры контейнера. Добавление функциональных возможностей к графическому интерфейсу выходит за его рамки.
 * Для включения и выключения визуализации промежутков используйте параметр  ``Визуализировать дополнительные сведения о компоновке``  после выбора  ``Сервис``  >  ``Параметры``  >  ``Java``  >  ``Конструктор графического интерфейса пользователя``  в главном меню IDE'.


 == Открытие примера проекта

 1. Загрузите и разарвируйте архив link:https://netbeans.org/projects/samples/downloads/download/Samples%252FJava%252FGapSupport.zip[+GapSupport.zip+] в любую папку на своем компьютере.
 2. В главном меню IDE NetBeans выберите  ``Файл``  >  ``Открыть проект`` , перейдите к папке, содержащей разархивированные файлы с проектом  ``GapSupport`` , разархивированном в предыдущем шаге.
 3. Нажмите кнопку "Открыть проект".
 Окно "Projects" (Проекты) должно выглядеть следующим образом:

 image::images/prj.png[]


 [start=4]
 . Дважды щелкните файл  ``Initial.java`` .
 В конструкторе графического интерфейса откроется образец формы в режиме конструктора.

 image::images/initialform.png[]

 *Примечание.* Можно просмотреть иерархию компонентов формы в окне навигатора, выбрав в основной панели инструментов Window > 'Навигатор'.

 image::images/navigator.png[]

 <<top,В начало>>


 == Изменение размера промежутка путем перетаскивания его краев

 Рассмотрим способы редактирования промежутка путем перетаскивания его краев в представлении 'Проектирование' в среде IDE.

 Чтобы добавить строку  ``Отчество``  между строками  ``Имя``  и  ``Фамилия``  необходимо выполнить следующие шаги:

 1. Щелкните промежуток между метками  ``Имя``  и  ``Фамилия`` .
 Промежуток выделяется зеленым.

 image::images/gap-highlighted.png[]


 [start=2]
 . Наведите курсор мыши на нижнюю часть выделенного промежутка.
 Указатель будет преобразован в вертикальный указатель с поддержкой изменения размера.

 image::images/gap-resizable.png[]


 [start=3]
 . Увеличить выбранный промежуток до 50 нажатием левой кнопки мыши, перетаскиванием указателя вниз, после чего следует отжать левую кнопку мыши.
 Новый размер промежутка отображается в подсказке.

 image::images/resizing.png[]


 [start=4]
 . Добавить новую метку в созданный промежуток, перетащив его из раздела 'Элементы управления Swing' палитры и отпустив его таким образом, чтобы левая граница была выровнена с левой границей метки  ``Имя``  а ее верхняя граница содержала указанный предпочитаемый промежуток из строки  ``Имя`` .

 image::images/jlabel.png[]


 [start=5]
 . Дважды щелкните метку и измените текст метки на  ``Отчество:`` .

 image::images/middle-name.png[]


 [start=6]
 . Добавьте новое текстовое поле к правой стороне метки  ``Отчество:``  перетащив его из раздела 'Элементы управления Swing' палитры и отпустив его, таким образом, чтобы его базовая линия была выровнена с меткой  ``Отчество`` , а левая граница была выровнена с другими текстовыми полями.

 image::images/textfield.png[]


 [start=7]
 . Перетащите правую границу текстового поля для выравнивания его с правой границей других текстовых полей.

 image::images/textfield-resized.png[]


 [start=8]
 . Щелкните правой кнопкой мыши текст внутри текстового поля и выбрав 'Редактировать текст' во всплывающем меню. Удалите текст.

 Строка  ``Отчество``  вставлена между компонентами формы.

 image::images/middle-inserted-gap.png[]

 <<top,В начало>>


 == Изменение промежутка с помощью колесика мыши

 Среда IDE позволяет изменить промежуток щелчком мыши и последующей прокруткой колесиком мыши для задания точного размера промежутка.

 Для удаление оставшегося пространства между строками  ``Отчество``  и  ``Фаилия``  щелкните промежуток ниже и уменьшите высоту промежутка путем прокрутки колесика мыши вниз и задания нового размера равным  ``малому по умолчанию`` .

 *Примечание.* Конструктор графического интерфейса пользователя NetBeans поддерживает три рекомендуемых промежутка для размещения компонентов -  ``малый по умолчанию`` ,  ``средний по умолчанию``  и  ``большой по умолчанию`` .

 image::images/default-small.png[]

 Размер промежутка между компонентами формы можно изменить с помощью колесика мыши и использование рекомендованного промежутка.

 image::images/middle-inserted.png[]

 <<top,В начало>>


 == Изменение промежутков рядом с компонентами

 Можно выполнить центрирование компонента, заключив его в два идентичных промежутка, которые были ранее помечены как поддерживающие изменение размера.

 *Примечание.* Контейнер используется для указания местоположения центрирования компонентов. Можно отцентрировать кнопки, не добавляя их к новой панели, но это трудно сделать в конструкторе графического интерфейса пользователя и полученная компоновка будет отличаться некоторой ненадежностью. Поэтому мы рекомендуем включать компонент, отцентрированный на панели там, где это возможно.

 *Для включения кнопок и промежутков с поддержкой изменения размера в отдельный контейнер выполните следующие действия:*

 1. Выберите в форме все четыре кнопки.
 2. Щелкните правой кнопкой мыши выборку и выберите  ``Заключить в``  >  ``Панель``  во всплывающем меню.

 image::images/enclose-panel.png[]

 Кнопки будут добавлены в контейнер.

 image::images/buttons-enclosed.png[]

 *Чтобы удалить новые созданные промежутки пробелы слева и справа от кнопок, выполните следующие шаги:*

 1. Щелкните правой кнопкой мыши одну из кнопок и выберите 'Изменить пространство компоновки' во всплывающем меню.
 Отображается диалоговое окно 'Изменить пространство компоновки'.

 image::images/edit-layout-space.png[]


 [start=2]
 . Задайте размер левого и правого промежутка равным 0 и нажмите OK.
 Промежутки справа и слева от кнопок удаляются с помощью диалогового окна 'Изменить пространство компоновки'.

 image::images/gaps-removed.png[]

 *Чтобы включить для промежутков выше и ниже контейнера поддержку изменения размера, выполните следующие действия:*

 1. Дважды щелкните промежуток в нижней части последней кнопки.
 Отображается диалоговое окно 'Изменить пространство компоновки'.

 [start=2]
 . В диалоговом окне выберите 'Изменить пространство компоновки' выберите параметр  ``С поддержкой изменения размера``  и нажмите ОК.

 [.feature]
 --
 image::images/bottom-small.png[role="left", link="images/bottom.png"]
 --


 [start=3]
 . Повторите шаги 1 и 2 для промежутка над самой верхней кнопкой.
 Для промежутков выше и ниже контейнера с кнопками включена поддержка изменения размера.

 *Центрирование кнопок в образце формы*:

 Перетащите нижнюю границу контейнера с кнопками для выравнивания с нижними границами списков, как показано ниже:

 image::images/align.png[]

 Контейнер растягивается для соответствия высоте списков  ``Доступные темы``  и  ``Выбранные темы`` . Кнопки центрируются в пространстве, определенном включающим контейнером, поскольку окружающие промежутки были помечены как поддерживающие изменение размера.

 image::images/buttons-centered.png[]

 <<top,В начало>>


 == Заключение

 В этом учебном руководстве была усовершенствована простая форма. Этот учебный курс разработан как руководство для описания способа выполнения изменений в существующей форме в режиме 'Свободное проектирование' для реализации специальной целевой компоновки, необходимой для проекта.

 <<top,В начало>>

 link:/about/contact_form.html?to=3&subject=Feedback:%20Gap%20Support[+Отправить отзыв по этому учебному курсу+]


 == Дополнительные сведения

 Изучение учебного курса 'Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans' завершено. Сведения о добавлении функциональных возможностей к создаваемому графическому интерфейсу приведены в разделах:

 * link:http://www.oracle.com/pls/topic/lookup?ctx=nb8000&id=NBDAG920[+Реализация графических интерфейсов Java+] в документе _Разработка приложений в IDE NetBeans_
 * link:gui-functionality.html[+Введение в создание графического интерфейса на языке Java+]
 * link:http://wiki.netbeans.org/NetBeansUserFAQ#GUI_Editor_.28Matisse.29[+Часто задаваемые вопросы по GUI Builder+]
 * link:../../trails/matisse.html[+Учебная карта по приложениям с графическим интерфейсом Java +]

 <<top,В начало>>
	//
	// Licensed to the Apache Software Foundation (ASF) under one
	// or more contributor license agreements. See the NOTICE file
	// distributed with this work for additional information
	// regarding copyright ownership. The ASF licenses this file
	// to you under the Apache License, Version 2.0 (the
	// "License"); you may not use this file except in compliance
	// with the License. You may obtain a copy of the License at
	//
	// http://www.apache.org/licenses/LICENSE-2.0
	//
	// Unless required by applicable law or agreed to in writing,
	// software distributed under the License is distributed on an
	// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
	// KIND, either express or implied. See the License for the
	// specific language governing permissions and limitations
	// under the License.
	//

	= Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans
	:jbake-type: tutorial
	:jbake-tags: tutorials
	:jbake-status: published
	:icons: font
	:syntax: true
	:source-highlighter: pygments
	:toc: left
	:toc-title:
	:description: Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans - Apache NetBeans
	:keywords: Apache NetBeans, Tutorials, Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans

	Ян Лагода (Jan Lahoda), Алена Сташкова (Alyona Stashkova)

	Компоновка контейнера в режиме 'Свободное проектирование' состоит из компонентов и промежутков между этими компонентами. И компоненты, и промежутки визуализированы в представлении 'Проектирование' конструктора графического интерфейса пользователя. IDE NetBeans позволяет редактировать промежутки напрямую в конструкторе графического интерфейса пользователя.

	В этом учебном курсе описывается использование редактирования промежутков для вставки новых компонентов пользовательского интерфейса между другими компонентами, а также простое центрирование компонентов вокруг фрейма в конструкторе графического интерфейса пользователя NetBeans без влияния на работу базового диспетчера компоновки. Этот учебный курс разработан как руководство для описания способа выполнения изменений в существующей форме в режиме 'Свободное проектирование' для реализации специальной целевой компоновки, необходимой для проекта.


	image::images/netbeans-stamp-80-74-73.png[title="Содержимое на этой странице применимо к IDE NetBeans 7.2, 7.3, 7.4 и 8.0"]


	Для работы с этим учебным курсом требуется следующее программное обеспечение и материалы.

	\|===
	\|Программное обеспечение или материал \|Требуемая версия

	\|link:https://netbeans.org/downloads/index.html[+IDE NetBeans+] \|7.2, 7.3, 7.4 или 8.0

	\|link:http://java.sun.com/javase/downloads/index.jsp[+Комплект для разработчика на языке Java (JDK)+] \|Версия 6, 7 или 8

	\|link:https://netbeans.org/projects/samples/downloads/download/Samples%252FJava%252FGapSupport.zip[+GapSupport.zip+] \|Архив с исходными файлами, содержащими начальную и целевую компоновки учебного курса.
	\|===

	Примечания

	* Проект, используемый в качестве отправной точки для данного курса, можно загрузить в форме архива ``.zip`` .
	* В данном руководстве основное внимание уделено созданию структуры контейнера. Добавление функциональных возможностей к графическому интерфейсу выходит за его рамки.
	* Для включения и выключения визуализации промежутков используйте параметр ``Визуализировать дополнительные сведения о компоновке`` после выбора ``Сервис`` > ``Параметры`` > ``Java`` > ``Конструктор графического интерфейса пользователя`` в главном меню IDE'.


	== Открытие примера проекта

	1. Загрузите и разарвируйте архив link:https://netbeans.org/projects/samples/downloads/download/Samples%252FJava%252FGapSupport.zip[+GapSupport.zip+] в любую папку на своем компьютере.
	2. В главном меню IDE NetBeans выберите ``Файл`` > ``Открыть проект`` , перейдите к папке, содержащей разархивированные файлы с проектом ``GapSupport`` , разархивированном в предыдущем шаге.
	3. Нажмите кнопку "Открыть проект".
	Окно "Projects" (Проекты) должно выглядеть следующим образом:

	image::images/prj.png[]


	[start=4]
	. Дважды щелкните файл ``Initial.java`` .
	В конструкторе графического интерфейса откроется образец формы в режиме конструктора.

	image::images/initialform.png[]

	Примечание. Можно просмотреть иерархию компонентов формы в окне навигатора, выбрав в основной панели инструментов Window > 'Навигатор'.

	image::images/navigator.png[]

	<<top,В начало>>


	== Изменение размера промежутка путем перетаскивания его краев

	Рассмотрим способы редактирования промежутка путем перетаскивания его краев в представлении 'Проектирование' в среде IDE.

	Чтобы добавить строку ``Отчество`` между строками ``Имя`` и ``Фамилия`` необходимо выполнить следующие шаги:

	1. Щелкните промежуток между метками ``Имя`` и ``Фамилия`` .
	Промежуток выделяется зеленым.

	image::images/gap-highlighted.png[]


	[start=2]
	. Наведите курсор мыши на нижнюю часть выделенного промежутка.
	Указатель будет преобразован в вертикальный указатель с поддержкой изменения размера.

	image::images/gap-resizable.png[]


	[start=3]
	. Увеличить выбранный промежуток до 50 нажатием левой кнопки мыши, перетаскиванием указателя вниз, после чего следует отжать левую кнопку мыши.
	Новый размер промежутка отображается в подсказке.

	image::images/resizing.png[]


	[start=4]
	. Добавить новую метку в созданный промежуток, перетащив его из раздела 'Элементы управления Swing' палитры и отпустив его таким образом, чтобы левая граница была выровнена с левой границей метки ``Имя`` а ее верхняя граница содержала указанный предпочитаемый промежуток из строки ``Имя`` .

	image::images/jlabel.png[]


	[start=5]
	. Дважды щелкните метку и измените текст метки на ``Отчество:`` .

	image::images/middle-name.png[]


	[start=6]
	. Добавьте новое текстовое поле к правой стороне метки ``Отчество:`` перетащив его из раздела 'Элементы управления Swing' палитры и отпустив его, таким образом, чтобы его базовая линия была выровнена с меткой ``Отчество`` , а левая граница была выровнена с другими текстовыми полями.

	image::images/textfield.png[]


	[start=7]
	. Перетащите правую границу текстового поля для выравнивания его с правой границей других текстовых полей.

	image::images/textfield-resized.png[]


	[start=8]
	. Щелкните правой кнопкой мыши текст внутри текстового поля и выбрав 'Редактировать текст' во всплывающем меню. Удалите текст.

	Строка ``Отчество`` вставлена между компонентами формы.

	image::images/middle-inserted-gap.png[]

	<<top,В начало>>


	== Изменение промежутка с помощью колесика мыши

	Среда IDE позволяет изменить промежуток щелчком мыши и последующей прокруткой колесиком мыши для задания точного размера промежутка.

	Для удаление оставшегося пространства между строками ``Отчество`` и ``Фаилия`` щелкните промежуток ниже и уменьшите высоту промежутка путем прокрутки колесика мыши вниз и задания нового размера равным ``малому по умолчанию`` .

	Примечание. Конструктор графического интерфейса пользователя NetBeans поддерживает три рекомендуемых промежутка для размещения компонентов - ``малый по умолчанию`` , ``средний по умолчанию`` и ``большой по умолчанию`` .

	image::images/default-small.png[]

	Размер промежутка между компонентами формы можно изменить с помощью колесика мыши и использование рекомендованного промежутка.

	image::images/middle-inserted.png[]

	<<top,В начало>>


	== Изменение промежутков рядом с компонентами

	Можно выполнить центрирование компонента, заключив его в два идентичных промежутка, которые были ранее помечены как поддерживающие изменение размера.

	Примечание. Контейнер используется для указания местоположения центрирования компонентов. Можно отцентрировать кнопки, не добавляя их к новой панели, но это трудно сделать в конструкторе графического интерфейса пользователя и полученная компоновка будет отличаться некоторой ненадежностью. Поэтому мы рекомендуем включать компонент, отцентрированный на панели там, где это возможно.

	Для включения кнопок и промежутков с поддержкой изменения размера в отдельный контейнер выполните следующие действия:

	1. Выберите в форме все четыре кнопки.
	2. Щелкните правой кнопкой мыши выборку и выберите ``Заключить в`` > ``Панель`` во всплывающем меню.

	image::images/enclose-panel.png[]

	Кнопки будут добавлены в контейнер.

	image::images/buttons-enclosed.png[]

	Чтобы удалить новые созданные промежутки пробелы слева и справа от кнопок, выполните следующие шаги:

	1. Щелкните правой кнопкой мыши одну из кнопок и выберите 'Изменить пространство компоновки' во всплывающем меню.
	Отображается диалоговое окно 'Изменить пространство компоновки'.

	image::images/edit-layout-space.png[]


	[start=2]
	. Задайте размер левого и правого промежутка равным 0 и нажмите OK.
	Промежутки справа и слева от кнопок удаляются с помощью диалогового окна 'Изменить пространство компоновки'.

	image::images/gaps-removed.png[]

	Чтобы включить для промежутков выше и ниже контейнера поддержку изменения размера, выполните следующие действия:

	1. Дважды щелкните промежуток в нижней части последней кнопки.
	Отображается диалоговое окно 'Изменить пространство компоновки'.

	[start=2]
	. В диалоговом окне выберите 'Изменить пространство компоновки' выберите параметр ``С поддержкой изменения размера`` и нажмите ОК.

	[.feature]
	--
	image::images/bottom-small.png[role="left", link="images/bottom.png"]
	--


	[start=3]
	. Повторите шаги 1 и 2 для промежутка над самой верхней кнопкой.
	Для промежутков выше и ниже контейнера с кнопками включена поддержка изменения размера.

	Центрирование кнопок в образце формы:

	Перетащите нижнюю границу контейнера с кнопками для выравнивания с нижними границами списков, как показано ниже:

	image::images/align.png[]

	Контейнер растягивается для соответствия высоте списков ``Доступные темы`` и ``Выбранные темы`` . Кнопки центрируются в пространстве, определенном включающим контейнером, поскольку окружающие промежутки были помечены как поддерживающие изменение размера.

	image::images/buttons-centered.png[]

	<<top,В начало>>


	== Заключение

	В этом учебном руководстве была усовершенствована простая форма. Этот учебный курс разработан как руководство для описания способа выполнения изменений в существующей форме в режиме 'Свободное проектирование' для реализации специальной целевой компоновки, необходимой для проекта.

	<<top,В начало>>

	link:/about/contact_form.html?to=3&subject=Feedback:%20Gap%20Support[+Отправить отзыв по этому учебному курсу+]



	== Дополнительные сведения

	Изучение учебного курса 'Поддержка редактирования промежутков в конструкторе графического интерфейса пользователя NetBeans' завершено. Сведения о добавлении функциональных возможностей к создаваемому графическому интерфейсу приведены в разделах:

	* link:http://www.oracle.com/pls/topic/lookup?ctx=nb8000&id=NBDAG920[+Реализация графических интерфейсов Java+] в документе _Разработка приложений в IDE NetBeans_
	* link:gui-functionality.html[+Введение в создание графического интерфейса на языке Java+]
	* link:http://wiki.netbeans.org/NetBeansUserFAQ#GUI_Editor_.28Matisse.29[+Часто задаваемые вопросы по GUI Builder+]
	* link:../../trails/matisse.html[+Учебная карта по приложениям с графическим интерфейсом Java +]

	<<top,В начало>>