Windev21 Aulas,Estudos e Desenvolvimento: DICAS 3006 - WINDEV TUTORIAL 29 - Adicionar e Modificar Janelas PRODUTOS

segunda-feira, 10 de agosto de 2020

DICAS 3006 - WINDEV TUTORIAL 29 - Adicionar e Modificar Janelas PRODUTOS - PARTE B

https://youtu.be/ya4BX8ZVQcI

Bom Dia/Boa Tarde/Boa Noite

Esse Ao Vivo vai estrear as 11:00 do dia 21/08/2020
DICAS 3006 - WINDEV TUTORIAL 29 - Adicionar e Modificar Janelas PRODUTOS - PARTE B
Tutoriel WINDEV : Leçon 4.2.b. Fenêtres d'ajout et de modification - Fiche produit
https://windevdesenvolvimento.blogspot.com/2020/08/dicas-3006-windev-tutorial-29-adicionar.html

ASSUNTOS

CRIANDO A JANELA FORMULARIO PRODUTOS
ADICIONANDO OS CAMPOS PELA ANALISE
REORGANIZANDO FORMULARIO
ADICIONANDO BOTOES DE VALIDAR E CANCELAR

https://doc.pcsoft.fr/fr-FR/?1410087532&name=lecon_42_fenetres_ajout_modification

Video original da Franca

https://youtu.be/PcBOHLVd6z0

Playlist Windev TUTORIAL
https://www.youtube.com/playlist?list=PLwJwZaqiZW-lxU1XF0M0htb5S5f8pavuE

Creating a "Product form" window

Creating the window

We are going to create a window used to display the characteristics of the product selected in the Table control. This type of window is called a "Form" because it corresponds to a descriptive form of requested element.

To create a window used to display the product details:
1. Open the "WD Full Application" project if necessary.
2. Create a new blank window.
  - Click among the quick access buttons.
  - The element creation window appears: click "Window" then "Window".
  - The window creation wizard starts.
  - In the "Based on a template" tab, choose "Use: WINTPL_Template" and validate the wizard.
3. The save window is displayed. Type the window title: "Product form". The name ("WIN_Product_form") is automatically proposed.
4. Validate the save window.

Creating edit controls

In our case, this "Form" window will display the content of the different items found in the "Product" data file.

To create the controls in the window:
1. Display the "Analysis" pane if necessary: on the "Home" pane, in the "Environment" group, expand "Panes" and select "Analysis". The different data files described in the "WD Full Application" analysis appear in the pane.
2. Click the icon on the left of "Product" data file: the items found in the data file are listed.
3. With the mouse, select all items displayed in the pane (except for the "ProductID" item). You can select multiple elements by holding the Ctrl key down.
4. Drag and Drop these items to the window that was just created.
5. Different controls are automatically created in the window. These controls are automatically linked to the corresponding item in the data file. To check this:
  - Select the "Reference" control for example.
  - Open the popup menu (right click) and select "Description".
  - Go to the "Link" tab in the description window:
    
    This tab shows that the current edit control is linked to the "Reference" item found in the "Product" data file.
6. Close the description window.
7. Save the window.

Reposition the controls in the window and resize the window in order to get the following interface:

Creating buttons

The "WIN_Product_form" window will be used to add a new product or to modify a product found in the list.

We are going to add a validation button and a cancelation button.

To create the Button control to validate the data entered:
1. On the "Creation" pane, in the "Usual controls" group, expand "Button" (click the arrow under ).
2. The list of preset buttons is displayed.
3. Click "OK": the Button control shape appears under the mouse pointer.
4. Then, click on the right of edit controls to create the Button control.

Add the Button control to cancel the input using the same principle.
1. On the "Creation" pane, in the "Usual controls" group, expand "Button" (click the arrow under ).
2. In the list of preset buttons, click "Cancel": the Button control shape appears under the mouse pointer.
3. Then click below the "OK" Button control to create the control.

Improving the window interface

This window being quite simple, let's try to improve its interface. Several details can become very annoying for the user so let's try to sort them out right now.

Aligning controls

One of the first optimizations consists in aligning the controls and in giving them the same size:

Select the "Caption" control then all edit controls found in the window (hold the Ctrl key down while clicking the different controls for example). The first selected control will be used as reference for the size of other controls.
In the ribbon, display the "Alignment" pane of WINDEV. This pane contains all alignment options available for the controls.

We want the outside and inside borders of controls to be aligned. Click "Justify (Ins. and Out.)".


	Remark	If you don't know which alignment to choose, hover the different options proposed by the "Alignment" pane of WINDEV. When hovering an option with the mouse cursor, the controls selected in the window are automatically positioned and/or resized according to the hovered option. If the positioning suits you, all you have to do is click the option. If the positioning does not suit you, all you have to do is hover the alignment options: the controls move back to their initial position.