Mostrando postagens com marcador ANCORAS. Mostrar todas as postagens
Mostrando postagens com marcador ANCORAS. Mostrar todas as postagens

sábado, 31 de outubro de 2020

DICAS 3166 -WEBDEV TUTORIAL 100 - 14-11-2020-10_00Hrs- Lesson 7.4. Ancoragem - Implementando a ancoragem - PARTE B - FINAL


https://youtu.be/gNt9SdjAoA0



Bom Dia Boa Tarde Boa Noite

Seja Membro do Canal

Esse Video Ao Vivo vai estrear as 10:00 do dia 14/11/2020-

DICAS 3166 -WEBDEV TUTORIAL 100 - 14-11-2020-10_00Hrs- Lesson 7.4. Ancoragem - Implementando a ancoragem - PARTE B - FINAL

ASSUNTOS


Aula TOP Demais sobre ancora..
se voce ainda nao entendeu assista a 
esse video .
Implementando a ancoragem
Entrar em zoning
Ancorar Cabecalho
Ancorar Menu
Ancorar Conteudo
Ancorar os controles do cabecalho,menu e conteudo
Explicando as ancoras
Explicando as posicoes dos controles 
Mostrando o repositorio windev
Proxima Licao: Lesson 8.1. Responsive Web Design



DICAS 3067 -WEBDEV TUTORIAL 1-Licao 1.1-14-09-2020 11hrs-DESCUBRA WEBDEV
DICAS 3068 -WEBDEV TUTORIAL 1-Licao 1.2-14-09-2020 15hrs-Web development and WEBDEV - PARTE A
DICAS 3069 -WEBDEV TUTORIAL 3-Licao 1.2-14-09-2020 16hrs-Web development and WEBDEV - PARTE B









PlayList WebDev tutorial Amarildo Webdev
Playlist Windev Tutorial Amarildo Windev
Playlist windev Franca PcSoft
Amarildo
Windev
WxSolucoes
Matos Informatica
Repositorio Windev
Site forum Google 
Video sobre 3 Mil Videos Windev 
PlayList Pedrosao
Video sobre Alfaserver servidor 
Ultimo Video manipulacao arquivos





ErpMatos - TgsSistemas
skype:amarildo.matos.informatica
email: amarildo.matos@gmail.com
whats: 51984197742
Youtube: Amarildo Matos
http://www.amarildomatos.com.br
https://groups.google.com/forum/#!forum/amarildowindev

www.windev.com
https://www.pcsoft.fr/webinaires.htm?p=forumpcs
https://forum.pcsoft.fr/fr-FR/pcsoft.br.windev/page/1.awp
https://www.windev.com/windev/WD-Express.htm
https://www.windev.com/windevmobile/WM-Express.htm
http://windevdesenvolvimento.blogspot.com.br/2017/07/menu-blog.html


Implementando a ancoragem
Em primeiro lugar, vamos implementar a ancoragem de áreas e depois a ancoragem de controles nas áreas.
Queremos obter o seguinte comportamento ao ampliar o navegador:
  • A área do cabeçalho (amarelo) deve ser ampliada em largura.
  • A área do menu (verde) deve ser aumentada em altura.
  • A área de conteúdo (laranja) deve ser ampliada em largura e altura.
  • Para os controles, queremos que eles permaneçam centralizados em relação à sua área.
Agora vamos realizar todas as operações necessárias.
  • Para implementar a ancoragem de áreas:
    1. Exiba a página no modo de zoneamento: clique na guia "Zoneamento" na parte superior da página.
    2. Selecione a área amarela.
    3. Exiba o menu pop-up e selecione "Ancorar". A janela para gerenciamento de âncoras é exibida.
    4. A área deve ser ampliada em largura. Selecione:
      • Posição: O controle mantém sua posição.
      • Ancorar na largura: Amplie ou reduza como o navegador.
      • Âncora em altura: Altura fixa.
    5. Validar.
    6. Selecione a área verde, exiba o menu pop-up e selecione "Âncora".
    7. A área deve ser aumentada em altura. Selecione:
      • Posição: Sem âncora.
      • Âncora em largura: largura fixa.
      • Âncora em altura: amplie ou reduza como o navegador.
    8. Validar.
    9. Selecione a área laranja e exiba a janela para gerenciamento de âncoras. A área deve ser ampliada em largura e altura. Selecione:
      • Posição: Sem âncora.
      • Ancorar na largura: Amplie ou reduza como o navegador.
      • Âncora em altura: amplie ou reduza como o navegador.
    10. Validar.
  • Para implementar a ancoragem de controles:
    1. Exiba a página no modo Página: clique na guia "Página" na parte superior da página.
    2. Selecione "Cabeçalho".
    3. Exiba o menu pop-up e selecione "Ancorar".
    4. O controle deve ser centralizado na largura:
      • Posição: centrado horizontalmente.
      • Âncora em largura: largura fixa.
      • Âncora em altura: Altura fixa.
    5. Validar.
    6. Repita as mesmas operações para o controle "Menu" e para o controle "Conteúdo":
      • A legenda "Menu" deve ser centrada verticalmente.
      • A legenda "Conteúdo" deve ser centralizada.
  • Salve a página (Ctrl + S) e execute o teste de página ( Execute o teste de uma páginaentre os botões de acesso rápido).
    1. A página é exibida no navegador.
    2. Redimensione o navegador: as áreas se adaptam ao espaço disponível no navegador.
  • Feche o navegador.
Postado por às Nenhum comentário:
Marcadores: , , , ,

terça-feira, 11 de agosto de 2020

DICAS 3008 - WINDEV TUTORIAL 31 - Adicionar e Modificar Janelas ANCORAS - PARTE D


https://youtu.be/_2-D4ZN7hdg


Bom Dia/Boa Tarde/Boa Noite

Esse Ao Vivo vai estrear as 18:00 do dia 21/08/2020 

DICAS 3008 - WINDEV TUTORIAL 31 - Adicionar e Modificar Janelas ANCORAS - PARTE D
Tutoriel WINDEV : Leçon 4.2.d. Fenêtres d'ajout et de modification - Ancrages

ASSUNTOS

VAMOS ANCORAR CADA CAMPO
MOSTRAR COMO SE SABE QUE ESTA COM ERRO A ANCORA
MOSTRAR QUE ELE MOSTRA A MELHOR OPCAO PARA ANCORA



Video original da Franca

https://youtu.be/8gEglAoulS4


Playlist Windev TUTORIAL

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





Managing anchors
  • Let's see the visual aspect of our window:
    1. On the "Modification" pane, in the "Preview" group, click "Preview". This runtime mode is used to display the window interface. The different codes are not run.
    2. Enlarge the window via the sizing handle found at the bottom of window. The position of controls is not modified and the window displays a large empty area. Two methods can be used to solve this problem:
      • Forbid the window from being resized.
      • Manage the anchors, which means manage the behavior of controls when resizing the window. That's what we are going to do.
        Window preview
    3. Close the preview: click the "Close" button or the cross found in the top right corner of window.

      Remark

      		How to manage anchors in a window?
      To manage the anchors:
      1. In the editor, reduce the window to its minimum size. All outside window borders must be "stuck" to a control.
      2. Study the controls one by one and ask yourself the following question : "How will the control react when the window is enlarged?". Then, apply the corresponding anchor.
  • For this window, we are going to define the anchors together:
    1. The "OK" and "Cancel" Button control must be anchored to the right.
      • Select these two controls.
      • Display the popup menu (right mouse click) and select "Anchor".
      • In the window for defining anchors, select "Right".
        Managing anchors
      • Validate.
      • Small red arrows appear in the editor, indicating that the controls are anchored to right.
    2. The edit controls must increase in width:
      • Select the 4 edit controls.
      • Display the popup menu (right mouse click) and select "Anchor".
      • In the window for defining anchors, select "Width" ( Anchor in width ).
      • Validate.
    3. We are going to test the operating mode of this window in preview:
      • On the "Modification" pane, in the "Preview" group, click "Preview".
      • Enlarge the window: the controls follow the enlargement in width.
      • We must now define the operating mode during the enlargement in height.
    4. The "Description" control can contain a larger or smaller product description. This is the largest control in the window: it must occupy the maximum available space. Apply an anchor in width and height to it ( Anchor in width and height ).
    5. The "Price BT" control is automatically bordered by a red line: the window editor signals an anchoring problem. Indeed, if the "Description" control stretches to the bottom, the "Price BT" control must move to the bottom accordingly.
    6. Open the anchoring window for the "Price BT" control. The best anchor is automatically proposed: "width and bottom" (a green checkmark is displayed). Select the proposed anchor and validate.
    7. We are going to test the operating mode of this window in preview:
      • On the "Modification" pane, in the "Preview" group, click "Preview".
      • Enlarge the window: the controls follow the enlargement in width and in height.
        Window preview
    8. Close the window preview to go back to the editor.

ErpMatos - TgsSistemas
skype:amarildo.matos.informatica
email: amarildo.matos@gmail.com
whats: 51984197742
Youtube: Amarildo Matos
http://www.amarildomatos.com.br
https://groups.google.com/forum/#!forum/amarildowindev

www.windev.com
https://www.pcsoft.fr/webinaires.htm?p=forumpcs
https://forum.pcsoft.fr/fr-FR/pcsoft.br.windev/page/1.awp
https://www.windev.com/windev/WD-Express.htm
https://www.windev.com/windevmobile/WM-Express.htm
http://windevdesenvolvimento.blogspot.com.br/2017/07/menu-blog.html






DICAS 2978 - WINDEV TUTORIAL 1 - 1.1B - WINDEV TEMA ESCURO E IDIOMA DO AMBIENTE
DICAS 2979 - WINDEV TUTORIAL 2 - 1.2- CRIAR JANELA E INSERIR TEXTO E EXIBIR
DICAS 2980 - WINDEV TUTORIAL 3 - 2.1- VARIAVEIS PARTE 1
DICAS 2981 - WINDEV TUTORIAL 4 - 2.2- VARIAVEIS ESCOPO - PARTE 2
DICAS 2982 - WINDEV TUTORIAL 5 - 2.1- VARIAVEIS OPERADORES PARTE 3
DICAS 2983 - WINDEV TUTORIAL 6 - 2.1.D - VARIAVEIS STRINGS PARTE 4
DICAS 2984 - WINDEV TUTORIAL 7 - 2.1.E - VARIAVEIS ARRAYS PARTE 5
DICAS 2985 - WINDEV TUTORIAL 8 - 2.2.A - CONDICOES IF-SWITCH PARTE 1
DICAS 2986 - WINDEV TUTORIAL 9 - 2.2.B - CONDICOES PARTE 2
DICAS 2987 - WINDEV TUTORIAL 10 - 2.3.A - LOOP PARTE 1
DICAS 2988 - WINDEV TUTORIAL 11 - 2.3.B - LOOP EXEMPLOS PARTE 2
DICAS 2989 - WINDEV TUTORIAL 12 - Lesson 2.4. The procedures - PARTE 1
DICAS 2990 - WINDEV TUTORIAL 13 - Leçon 2.4.b. Procedures Parametros - PARTE 2
DICAS 2991 - WINDEV TUTORIAL 14 - PROCEDURES REFERENCIA - PARTE 3
DICAS 2992 - WINDEV TUTORIAL 15 - PROCEDURES OPCIONAIS OU OBRIGATORIAS - PARTE 4
DICAS 2993 - WINDEV TUTORIAL 16 - PROCEDURES EXEMPLOS - PARTE 5
DICAS 2994 - WINDEV TUTORIAL 17 - PERGUNTAS E RESPOSTA - PARTE 1
DICAS 2995 - WINDEV TUTORIAL 18 - PERGUNTAS E RESPOSTA - PARTE 2
DICAS 2996 - WINDEV TUTORIAL 19 - WINDEV E OS BANCOS DE DADOS
DICAS 2997 - WINDEV TUTORIAL 20 - PROJETO E ANALISE - CRIACAO
DICAS 2998 - WINDEV TUTORIAL 21 - PROJETO E ANALISE - ARQUIVOS DADOS CLIENTE - PARTE 2
DICAS 2999 - WINDEV TUTORIAL 22 - PROJETO E ANALISE - ARQUIVOS DADOS CRIACAO ARQUIVO PEDIDO - PARTE 3
DICAS 3000 - WINDEV TUTORIAL 23 - PROJETO E ANALISE - IMPORTANDO CVS-ARQUIVO TEXTO - PARTE 4
DICAS 3001 - WINDEV TUTORIAL 24 - PROJETO E ANALISE - IMPORTANDO ARQUIVO PRODUTO - PARTE 5
DICAS 3002 - WINDEV TUTORIAL 25 - PROJETO E ANALISE - LINK - PARTE 6
DICAS 3003 - WINDEV TUTORIAL 26 - RAD COMPLETO
DICAS 3004 - WINDEV TUTORIAL 27 - VISAO GERAL
DICAS 3005 - WINDEV TUTORIAL 28 - Adicionar e Modificar Janelas PRODUTOS - PARTE A
DICAS 3006 - WINDEV TUTORIAL 29 - Adicionar e Modificar Janelas PRODUTOS Formulario - PARTE B
DICAS 3007 - WINDEV TUTORIAL 30 - Adicionar e Modificar Janelas PRODUTOS ALINHAR CAMPOS - PARTE C










Postado por às Nenhum comentário:
Marcadores: ,
Assinar: Postagens (Atom)

Teste

Teste
teste