curso - lianja app builder

27
Lianja App Builder - Introdução (parte 1) Introdução ao Lianja Este artigo fornece uma introdução geral para Lianja eo Lianja App Builder. O público-alvo é para iniciantes que não sabem nada sobre Lianja em tudo e quer ganhar uma compreensão do Application Platform Lianja e como desenvolver aplicativos usando o Lianja App Builder. Lianja App Builder Visão Geral O Lianja App Builder está contido dentro de uma janela única constituída de painéis de espaço de trabalho vários que podem ser ativadas clicando nas guias de seleção no Modebar. Você começa no App Center na guia Início. Aqui você tem um clique acesso a seus aplicativos publicados e ações fundamentais para o desenvolvimento App. O ponto focal para a construção de aplicativos de desktop e web em Lianja é o design visual e desenvolvimento do espaço de trabalho do painel conhecido como o Criador de página e é isso que nós vamos concentrar neste tutorial. Para carregar o aplicativo de amostra lianjademo, clique em seu azulejo na App Center. O espaço de trabalho é automaticamente selecionado páginas ea App lianjademo carregado no Construtor de Página.

Upload: leofpe2534

Post on 29-Nov-2015

435 views

Category:

Documents


10 download

TRANSCRIPT

Page 1: CURSO - Lianja App Builder

Lianja App Builder - Introdução (parte 1)Introdução ao LianjaEste artigo fornece uma introdução geral para Lianja eo Lianja App Builder. O público-alvo é para iniciantes que não sabem nada sobre Lianja em tudo e quer ganhar uma compreensão do Application Platform Lianja e como desenvolver aplicativos usando o Lianja App Builder.

Lianja App Builder Visão GeralO Lianja App Builder está contido dentro de uma janela única constituída de painéis de espaço de trabalho vários que podem ser ativadas clicando nas guias de seleção no Modebar. Você começa no App Center na guia Início. Aqui você tem um clique acesso a seus aplicativos publicados e ações fundamentais para o desenvolvimento App.

O ponto focal para a construção de aplicativos de desktop e web em Lianja é o design visual e desenvolvimento do espaço de trabalho do painel conhecido como o Criador de página e é isso que nós vamos concentrar neste tutorial. Para carregar o aplicativo de amostra lianjademo, clique em seu azulejo na App Center. O espaço de trabalho é automaticamente selecionado páginas ea App lianjademo carregado no Construtor de Página.

Page 2: CURSO - Lianja App Builder

Page Builder Visão GeralUsando o construtor de página você pode visualmente construir uma aplicação data-centric que pode combinar dados e conteúdo interessante outro de uma ampla variedade de fontes de dados, bancos de dados, serviços web usando REST e outras fontes de dados personalizados. Se você é um não-programador com um bom conhecimento de seu domínio de negócio que você provavelmente será capaz de construir um aplicativo que não requer nenhuma programação a ser feito. Como isso é possível, você pode perguntar? Você vai descobrir, durante o curso desses tutoriais como Lianja tem uma visão radicalmente diferente do processo de desenvolvimento de aplicações em comparação com outros bancos de dados e ferramentas de desenvolvimento web.

Como mencionado anteriormente, o uso do Construtor página visualmente construir uma aplicação data-centric. Em Lianja, apps são feitos de uma variedade de elementos visuais. Usando o construtor de página, você organiza os elementos visuais em um aplicativo. O elemento base visual é uma página. Páginas são feitas de Seções.

Page 3: CURSO - Lianja App Builder

Existem vários tipos de pré-construídas seções comumente usados para ajudar a acelerar o seu desenvolvimento; Form, Grid, Webview, Imagem Strip, lona e TabView. Seções do formulário são feitos de Campos e Gadgets.Para os desenvolvedores profissionais, você também pode desenvolver seções personalizadas e brindes personalizados em Recital, Visual FoxPro, JavaScript, PHP ou Python e reutilizá-los entre muitos aplicativos que você constrói.Para tornar mais fácil para criar aplicativos que serão executados nativa na área de trabalho e também em um navegador web, Lianja tem uma característica Application Framework completo. Este quadro de aplicação é uma implementação do Visual estrutura de aplicativo FoxPro 9. Tem sido amplamente estendido para fornecer mais moderno e mais fácil de usar componentes que são multi-plataforma, linguagem e UI independente.Você pode construir seções personalizadas e gadgets usando o Application Framework Lianja no Considerando, Visual FoxPro, JavaScript, PHP e Python.Para detalhes completos da Application Framework Lianja ver a documentação no Workspace Home.

Construa seu primeiro aplicativo LianjaA maneira mais fácil de mostrar-lhe o poder ea simplicidade do Lianja é construir uma App!Volte para o App Center no Painel de Espaço de Trabalho inicial clicando na guia Seleção Principal localizado no Modebar à esquerda da janela principal ou o ToolButton Home no Headerbar. Você pode alternar entre os

Page 4: CURSO - Lianja App Builder

diferentes painéis do espaço de trabalho a qualquer momento.Agora clique no botão Criar um aplicativo Tile.

Você também pode criar Aplicativos do Painel Workspace Aplicativos, clicando no botão + no Actionbar do Painel Apps localizado na barra lateral do Apps.

O Lianja App Builder inclui uma ampla gama de modelos pré-construídos aplicativos que podem ser baixados da Galeria de Modelos Lianja

Criação de um aplicativoO diálogo Criar um aplicativo irá deslizar para fora do lado esquerdo da janela principal. Digite o nome do aplicativo que você deseja criar e pressione Enter ou clique no botão Criar.

Depois de ter criado um aplicativo que você pode desenvolver seções personalizadas e gadgets no Considerando, Visual FoxPro, JavaScript, PHP e Python. Você vai aprender mais sobre isso mais tarde.

Page 5: CURSO - Lianja App Builder

Aplicativos Lianja são compostos de páginasAgora o painel de espaço de trabalho páginas serão exibidas e uma página em branco será criado contendo uma seção de forma vazia. As páginas são os elementos básicos visuais de um aplicativo e são, por sua vez, constituída por secções.

Um aplicativo Lianja pode consistir de muitas páginas que ser ser agrupadas em coleções de página. Isso tudo é feito visualmente utilizando gota 'n' arrastar.

Adicionando seções do formulário para páginasClique duas vezes no banco de dados Southwind no painel Bancos de dados da barra lateral. Você vai notar que as tabelas contidas no banco de dados Southwind agora são listados no painel Tabelas. Clique na tabela clientes e arrastá-lo para a seção de forma vazia para preenchê-lo com as colunas da tabela.

Não se preocupe com a ordem em que os campos são adicionados à seção forma como estes podem ser reordenadas ou totalmente removido mais tarde. Vamos pegar um formulário padrão colocado em primeiro lugar.

Page 6: CURSO - Lianja App Builder

Adicionando seções da grade para páginasAgora clique no botão Seções nas ferramentas de formulário. Seleccione Grid, e uma secção de grade vazia será adicionada à página.

Tome nota das ferramentas de formulário na parte inferior da página. Grande parte da aparência da página pode ser modificada a partir daqui.

Preenchendo uma grade com dadosClique para selecionar a tabela de pedidos no painel Tabelas e arraste-o para a secção de grade que você acabou de criar. A grade será preenchido com as colunas da tabela de pedidos.

As colunas de grade podem ser movimentados, arrastando e soltando os cabeçalhos das colunas da grade. Colunas individuais pode ser personalizado com um duplo clique no cabeçalho da coluna. Botão direito do mouse sobre o cabeçalho da coluna permite ocultar uma coluna.Note-se também que os dados que você está trabalhando é tudo ao vivo para que você está vendo exatamente como o aplicativo vai olhar em tempo de execução.

Page 7: CURSO - Lianja App Builder

Agora adicione outra seção da grade e preenchê-lo com as colunas da tabela order_details.

Lianja aplicativos são todos multi-usuário. Bloqueio de registro otimista é usada para lidar com multi-usuário actualização dos dados. Se você está construindo uma aplicação desktop toda bloqueio de registro é feita automaticamente para você, desktop e web.

Relacionando seções juntasAgora que você tem uma página básica contendo três pré-construídos seções que você pode relacionar o cliente na forma de clientes às suas ordens na grade ordens e então cada fim de seus detalhes de ordem. Em Lianja isso é simples: cada Seção pode estar relacionado visualmente para outras seções na página usando o Construtor de Relacionamento.Clique no sinal de + no painel Construtor de Relacionamento ao lado da seção pai. Em seguida, clique no cabeçalho da seção para a seção infantil que pretende relacionar.

Nota para desenvolvedores avançados. Relacional junta fácil e super-rápido. Se as chaves primárias e estrangeiras

Page 8: CURSO - Lianja App Builder

escolhidas por Lianja não são o que você quiser, eles podem ser especificados manualmente, clicando duas vezes sobre o cabeçalho da seção apropriada e alterá-los na seção atribui diálogo.

Construtor de Relacionamento VisualVocê vai ver agora que o Construtor de Relacionamento exibe um diagrama de relacionamento entre as partes. Cada seção pode se relacionar com uma ou mais seções da criança, que pode ser de qualquer tipo: forma, Grid, Webview, Imagem tira, TabView, Anexos ou Personalizado.Adicionar relações adicionais entre seções clicando no botão + ao lado do pai em seguida, clicando no cabeçalho da seção infantil. Se você quiser fazer uma mudança, você pode desconectar uma relação clicando no sinal -.

Visualmente relacionar tantas seções como você quer. Um-para-um ou relacionamentos um-para-muitos totalmente suportados. Não é necessário programação.

Personalizando atributos de páginaPara personalizar a aparência de uma página, clique duas vezes no Headerbar página ou clique no ToolButton Cogs.

Page 9: CURSO - Lianja App Builder

Você pode personalizar a aparência de seções e gadgets clicando duas vezes no seu cabeçalho. No caso de campos de formulário, divisores e separadores de coluna, clique duas vezes sobre a legenda.

Atributos da páginaA página de diálogo Atributos irá deslizar a partir do lado direito da janela principal. Agora, mudar o título da página ea legenda cabeçalhocomo mostrado.

Nota para desenvolvedores avançados. Cada elemento visual em Lianja (página, seção, Gadget, e Campo) tem um estilo CSS que pode ser especificado no diálogo atributos. Você especifica atributos CSS, da mesma forma como faria ao definir estilos html, no entanto estilos CSS também pode ser aplicado à propriedade de estilo em todas as classes Framework Lianja aplicativo.

Personalizando uma SeçãoPara personalizar a aparência das seções, clique duas vezes no cabeçalho Seção e da Seção de diálogo Atributos irá deslizar dentro Alterar otítulo da seção para os clientes, em seguida, repita o mesmo processo para a seção de encomendas ea seção order_details.

Page 10: CURSO - Lianja App Builder

Note-se que o formulário barra de ferramentas também permite que você personalizar o layout das seções.

Pronto para ser executadoAgora, a página deve ser semelhante a este.

Se precisar de mais espaço na tela na concepção das páginas você pode ocultar a barra lateral e Modebar usando o menu Exibir no menu do sistema Pages.

Runtime vistaPara visualizar o aplicativo em vista Runtime, basta clicar no ícone de exibição de tempo de execução no Headerbar.

Page 11: CURSO - Lianja App Builder

Aplicativos Lianja pode ser executado a partir de atalhos na área sem invocar o ambiente de desenvolvimento e, claro, a partir da web em um navegador.

Runtime vista e visão de desenvolvimentoAgora você vê o App a correr! É tão simples como isso. Você pode mover entre os registros usando os controles de navegação na Actionbar. Para voltar à vista de Desenvolvimento basta clicar no ícone no Headerbar.

Observe o ícone de tela cheia de alternância para a esquerda do Instant Search. Isso permite que aplicativos Lianja para executar em tela cheia sem bordas da janela. Perfeito para equipamentos de informação e caixas de TV set-top. A exibição do ícone é activado / desactivado nos Atributos da página.

Page 12: CURSO - Lianja App Builder

Parte2

Lianja App Builder - Primeiros Passos (parte 2)Pesquisar banco de dados Made EasyPesquisa instantâneaObserve que no headerbar página há uma caixa de pesquisa que oferece pesquisa instantânea através dos dados que estão sendo exibidos na página. Para usar a pesquisa instante em que você precisa especificar qual campo na página é o campo de pesquisa. Para fazer isso, clique duas vezes sobre a legenda do campo que você deseja usar.

Campo de pesquisaO Campo de diálogo Atributos irá deslizar da direita. Desça até a seção Dados de sub-e clique na caixa campo de pesquisa, em seguida, clique em Concluído.

Page 13: CURSO - Lianja App Builder

Usando a Pesquisa InstantâneaO campo de pesquisa será indicado por um ícone de chave a ser exibido à esquerda de sua legenda. Digitar qualquer texto na caixa de pesquisa instantânea irá agora recuperar instantaneamente o primeiro registro que corresponde ao valor de chave de busca. Os controles de navegação na actionbar agora mover-se apenas entre os registros que correspondem ao valor de pesquisa. Você pode redefinir a pesquisa a qualquer momento, clicando no X localizado no lado direito da caixa de pesquisa instantânea e todos os registros estarão disponíveis novamente.

Note que você pode ocultar o ícone do campo de pesquisa em tempo de execução a partir do diálogo Atributos Seção.

Seleções instantâneasOutro recurso built-in poderoso de todas as páginas que você projeto é Seleções instantâneas. Se você está familiarizado com as etiquetas do Gmail do Google, então você vai se sentir em casa com seleções instantâneas - uma vez criado, eles permitem que você para restringir os dados mostrados com um único clique. Seleções instantâneas realizar uma pesquisa de texto completo em todos os campos em seus registros de banco de dados, mas não há necessidade de criar os índices especiais ou executar uma operação de consulta de banco de dados (SQL ou

Page 14: CURSO - Lianja App Builder

não). Para adicionar uma Seleção instantânea para sua página (você pode ter diferentes Seleções imediatas para cada página que compõe sua app) basta clicar no botão +na parte inferior da barra lateral esquerda.

Seleções instantâneas são dependentes página que lhe permite ter pontos de vista diferentes dos dados, dependendo da página que você está visualizando

Criando uma Seleção instantâneaCriar uma caixa de diálogo Seleção vai deslizar a partir do lado esquerdo da janela principal. Decidir sobre a cor do rótulo e legenda para a sua Seleção instantânea, em seguida, especificar o texto a pesquisar - neste caso, a Seleção instantânea irá escolher apenas os registros que contenham "EUA".

Seleções instantâneas pode realizar uma pesquisa de texto completo em todos os dados em todos os campos de todos os registros em uma tabela do banco de dados, e pode, opcionalmente, filtrar registros com base em uma condição de consulta.

Usando uma Seleção instantânea

Page 15: CURSO - Lianja App Builder

Ativar um "Seleção instantânea", clicando em seu rótulo na barra lateral esquerda. O número de registros correspondentes a Seleção instantânea é mostrada no topo da página ao lado de seu rótulo e os botões de navegação no movimento actionbar através dos registros correspondentes. Você pode desativar a seleção, clicando no rótulo "Todos".

Aqui está a Seleção instantânea na Vista Runtime.

Observe também, que os dados vistos recentemente, modificado recentemente, e os registros que denotam como Favoritos - basta clicar na estrela para fazer um registro de um favorito - pode ser selecionado apenas clicando nos links na barra lateral esquerda.

Page 16: CURSO - Lianja App Builder

Parte 3

Lianja App Builder - Primeiros Passos (parte 3)Estendendo seu primeiro aplicativoAdicionando uma nova páginaAgora vamos incrementar o app através da construção de uma página adicional que fornece informações sobre os funcionários.Criar uma nova página em branco, clicando no ícone de página nas ferramentas de formulário. Se você receber uma seção de formulário embranco criado para você por padrão com a página - isso é determinado pelas configurações do aplicativo (Definições na parte inferior do Modebar) - clique no ícone de lixeira no cabeçalho de seção para removê-lo, como fazemos não precisa.

Em vez de remover a seção formulário padrão, você pode adicionar a seção Faixa de imagem como abaixo e clique na imagem de cabeçalho de seção Strip e arraste-o sobre o cabeçalho da seção Formulário para trocar a ordem das duas seções.

Tiras de imagemAgora clique no ícone Seções nas ferramentas de formulário e selecionar a Faixa de Imagem.

Page 17: CURSO - Lianja App Builder

Observe o Webview também. Isso permite que qualquer conteúdo da web para ser processado em uma seção. O URI especificado pode conter referências a registros de dados ativos de outras seções. Para fazer referência a dados na URI por exemplo chaves uso encaracolados {} CUSTOMERS.NAME. Isso permite que o conteúdo da web para ser relacionada aos dados do banco de dados.

Preencher uma Faixa de ImagemAgora clique na tabela de funcionários no painel Tabelas, em seguida, clique no campo de fotografia e arrastá-lo para a seção Faixa de imagemque você criou na etapa anterior.

Note-se que as imagens no banco de dados automaticamente paginar na faixa imagem.

Adicionar uma seção Formulário AdicionalAgora clique em Seções nas ferramentas de formulário e selecione Form. A secção de nova forma será adicionado à página. Agora clique na tabela defuncionários, como mostrado abaixo e arraste-o para a nova seção que você acabou de criar (ou apenas arraste a tabela para uma área vazia da página.

Page 18: CURSO - Lianja App Builder

Personalização de campos seção de formulárioA legenda para os campos na seção formulário pode ser personalizado movendo o cursor do mouse sobre o título e clicar no ícone de edição.

Você pode remover campos que você não deseja que estejam visíveis, clicando no ícone de exclusão, que é exibido.

DivisoresClique e arraste a alça azul no centro da borda inferior da seção selecionada para redimensioná-lo. Campos em uma seção de formulário pode ser clicado e arrastado para alterar a exibição de encomenda. Você também pode adicionar legendas, separadores horizontais, divisores de coluna ou espaçadores para a seção clicando no

Page 19: CURSO - Lianja App Builder

ícone Divisores nas ferramentas de formulário. Uma vez que a legenda é exibida na forma seção você pode arrastá-la em uma posição adequada.

Legendas horizontais são legendas que podem ser colocados em qualquer lugar no formulário. Divisores de coluna são legendas horizontais na parte superior de uma coluna vertical. Separadores horizontais exibidos como uma linha horizontal, ao passo que espaçadores são usados para proporcionar um espaço em branco entre campos ou outros controlos.

Divisores de personalizaçãoAdicionar uma legenda e um divisor de coluna e editar suas legendas como mostrado abaixo.

Como os campos, clicar duas vezes sobre a legenda para personalizar os atributos de um divisor.

Page 20: CURSO - Lianja App Builder

Ricos Editores de TextoAgora adicione outra seção do formulário e arraste no campo Notas empregado como mostrado abaixo. Por padrão, o campo de comprimento (memorando) Notas variável é exibido em um editor de texto rico.

Seções PersonalizandoVocê pode personalizar a aparência de seções usando a seção de atributos de diálogo clicando duas vezes sobre o cabeçalho de seção ou clicando no ícone cog. Definir a legenda para cada uma das três seções.

Page 21: CURSO - Lianja App Builder

Relativas aos pontos Faixa de ImagemAgora relacionar a seção Faixa de Imagem (vários registros funcionários) para a seção Form (detalhes para registros individuais empregados).

Note que você pode se relacionar seções juntas mesmo que contenham dados da tabela mesmo banco de dados.

Tome um outro olhar para o seu aplicativo na Vista Runtime.

Page 22: CURSO - Lianja App Builder

Parte 4

Lianja App Builder - Introdução (parte 4)Coleções páginaVocê agora deve ter duas páginas em seu aplicativo. Você pode construir como muitos como você deseja. Você pode agrupar páginas em grupos lógicos (menus), criando uma coleção de Page. Criar uma coleção Página denominado Admin como mostrado abaixo.

Page 23: CURSO - Lianja App Builder

Para adicionar páginas em uma coleção de página, basta clicar sobre o título da página na headerbar Page e arraste o título em cima do botãoPage Coleção.

Acessando as páginas de uma coleção PáginaAgora, como você pode ver abaixo as duas páginas Clientes e funcionários são agora agrupados na Coleção página de administração.

Page 24: CURSO - Lianja App Builder

No menu da página também podem ser exibidos na barra lateral esquerda. Clique duas vezes no Headerbar ou clique no botão engrenagens para acessar os atributos de página e verifique o atributo Mostrar Menu.

Igualmente, você pode configurar se o menu de navegação será mostrado no Headerbar. Esta é uma configuração App-larga, então clique no botãoConfigurações na parte inferior da Modebar para acessar as configurações do aplicativo.

Page 25: CURSO - Lianja App Builder

Se você deseja mover as páginas de um Page Coleção basta arrastar e soltá-los de volta para o Headerbar. Você também pode reordenar páginasdo conjunto de página arrastando-os na Headerbar seguida, de volta para a coleção.

Note que o botão direito sobre o título Page Coleção permite renomear ou apagar a coleção.

Executando o aplicativo concluídoAgora você tem um aplicativo que consiste em duas páginas. Clique no ícone de vista de tempo de execução e executar o aplicativo concluído. É tão simples quanto isso!