Sie sind auf Seite 1von 27

Lianja App Builder - Introduo (parte 1) Introduo ao Lianja

Este artigo fornece uma introduo geral para Lianja eo Lianja App Builder. O pblico-alvo para iniciantes que no sabem nada sobre Lianja em tudo e quer ganhar uma compreenso do Application Platform Lianja e como desenvolver aplicativos usando o Lianja App Builder.

Lianja App Builder Viso Geral


O Lianja App Builder est contido dentro de uma janela nica constituda de painis de espao de trabalho vrios que podem ser ativadas clicando nas guias de seleo no Modebar. Voc comea no App Center na guia Incio. Aqui voc tem um clique acesso a seus aplicativos publicados e aes fundamentais para o desenvolvimento App.

O ponto focal para a construo de aplicativos de desktop e web em Lianja o design visual e desenvolvimento do espao de trabalho do painel conhecido como o Criador de pgina e isso que ns vamos concentrar neste tutorial. Para carregar o aplicativo de amostra lianjademo, clique em seu azulejo na App Center. O espao de trabalho automaticamente selecionado pginas ea App lianjademo carregado no Construtor de Pgina.

Page Builder Viso Geral


Usando o construtor de pgina voc pode visualmente construir uma aplicao data-centric que pode combinar dados e contedo interessante outro de uma ampla variedade de fontes de dados, bancos de dados, servios web usando REST e outras fontes de dados personalizados. Se voc um no-programador com um bom conhecimento de seu domnio de negcio que voc provavelmente ser capaz de construir um aplicativo que no requer nenhuma programao a ser feito. Como isso possvel, voc pode perguntar? Voc vai descobrir, durante o curso desses tutoriais como Lianja tem uma viso radicalmente diferente do processo de desenvolvimento de aplicaes em comparao com outros bancos de dados e ferramentas de desenvolvimento web.

Como mencionado anteriormente, o uso do Construtor pgina visualmente construir uma aplicao data-centric. Em Lianja, apps so feitos de uma variedade de elementos visuais. Usando o construtor de pgina, voc organiza os elementos visuais em um aplicativo. O elemento base visual uma pgina. Pginas so feitas de Sees.

Existem vrios tipos de pr-construdas sees comumente usados para ajudar a acelerar o seu desenvolvimento; Form, Grid, Webview, Imagem Strip, lona e TabView. Sees do formulrio so feitos de Campos e Gadgets. Para os desenvolvedores profissionais, voc tambm pode desenvolver sees personalizadas e brindes personalizados em Recital, Visual FoxPro, JavaScript, PHP ou Python e reutiliz-los entre muitos aplicativos que voc constri. Para tornar mais fcil para criar aplicativos que sero executados nativa na rea de trabalho e tambm em um navegador web, Lianja tem uma caracterstica Application Framework completo. Este quadro de aplicao uma implementao do Visual estrutura de aplicativo FoxPro 9. Tem sido amplamente estendido para fornecer mais moderno e mais fcil de usar componentes que so multi-plataforma, linguagem e UI independente. Voc pode construir sees 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 documentao no Workspace Home.

Construa seu primeiro aplicativo Lianja

A maneira mais fcil de mostrar-lhe o poder ea simplicidade do Lianja construir uma App! Volte para o App Center no Painel de Espao de Trabalho inicial clicando na guia Seleo Principal localizado no Modebar esquerda da janela principal ou o ToolButton Home no Headerbar. Voc pode alternar entre os diferentes painis do espao de trabalho a qualquer momento. Agora clique no boto Criar um aplicativo Tile. Voc tambm pode criar Aplicativos do Painel Workspace Aplicativos, clicando no boto + no Actionbar do Painel Apps localizado na barra lateral do Apps.

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

Criao de um aplicativo
O dilogo 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 boto Criar.

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

Aplicativos Lianja so compostos de pginas


Agora o painel de espao de trabalho pginas sero exibidas e uma pgina em branco ser criado contendo uma seo de forma vazia. As pginas so os elementos bsicos visuais de um aplicativo e so, por sua vez, constituda por seces.

Um aplicativo Lianja pode consistir de muitas pginas que ser ser agrupadas em colees de pgina. Isso tudo feito visualmente utilizando gota 'n' arrastar.

Adicionando sees do formulrio para pginas


Clique 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 so listados no painel Tabelas. Clique na tabela clientes e arrast-lo para a seo de forma vazia para preench-lo com as colunas da tabela.

No se preocupe com a ordem em que os campos so adicionados seo forma como estes podem ser reordenadas ou totalmente removido mais tarde. Vamos pegar um formulrio padro colocado em primeiro lugar.

Adicionando sees da grade para pginas


Agora clique no boto Sees nas ferramentas de formulrio. Seleccione Grid, e uma seco de grade vazia ser adicionada pgina.

Tome nota das ferramentas de formulrio na parte inferior da pgina. Grande parte da aparncia da pgina pode ser modificada a partir daqui.

Preenchendo uma grade com dados


Clique para selecionar a tabela de pedidos no painel Tabelas e arraste-o para a seco 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 cabealhos das colunas da grade. Colunas individuais pode ser personalizado com um duplo clique no cabealho da coluna. Boto direito do mouse sobre o cabealho da coluna permite ocultar uma coluna.Note-se tambm que os dados que voc est trabalhando tudo ao vivo para que voc est vendo exatamente como o aplicativo vai olhar em tempo de execuo. Agora adicione outra seo da grade e preench-lo com as colunas da tabela order_details.

Lianja aplicativos so todos multi-usurio. Bloqueio de registro otimista usada para lidar com multi-usurio actualizao dos dados. Se voc est construindo uma aplicao desktop toda bloqueio de registro feita automaticamente para voc,

desktop e web.

Relacionando sees juntas


Agora que voc tem uma pgina bsica contendo trs pr-construdos sees que voc pode relacionar o cliente na forma de clientes s suas ordens na grade ordens e ento cada fim de seus detalhes de ordem. Em Lianja isso simples: cada Seo pode estar relacionado visualmente para outras sees na pgina usando o Construtor de Relacionamento. Clique no sinal de + no painel Construtor de Relacionamento ao lado da seo pai. Em seguida, clique no cabealho da seo para a seo infantil que pretende relacionar.

Nota para desenvolvedores avanados. Relacional junta fcil e super-rpido. Se as chaves primrias e estrangeiras escolhidas por Lianja no so o que voc quiser, eles podem ser especificados manualmente, clicando duas vezes sobre o cabealho da seo apropriada e alter-los na seo atribui dilogo.

Construtor de Relacionamento Visual


Voc vai ver agora que o Construtor de Relacionamento exibe um diagrama de relacionamento entre as partes. Cada seo pode se relacionar com uma ou mais sees da criana, que pode ser de qualquer tipo: forma, Grid, Webview, Imagem tira, TabView, Anexos ou Personalizado.Adicionar relaes adicionais entre sees clicando no boto + ao lado do pai em seguida, clicando no cabealho da seo infantil. Se voc quiser fazer uma mudana, voc pode desconectar uma relao clicando no sinal -.

Visualmente relacionar tantas sees como voc quer. Um-para-um ou relacionamentos um-para-muitos totalmente suportados. No necessrio programao.

Personalizando atributos de pgina


Para personalizar a aparncia de uma pgina, clique duas vezes no Headerbar pgina ou clique no ToolButton Cogs.

Voc pode personalizar a aparncia de sees e gadgets clicando duas vezes no seu cabealho. No caso de campos de formulrio, divisores e separadores de coluna, clique duas vezes sobre a legenda.

Atributos da pgina
A pgina de dilogo Atributos ir deslizar a partir do lado direito da janela principal. Agora, mudar o ttulo da pgina ea legenda cabealhocomo mostrado.

Nota para desenvolvedores avanados. Cada elemento visual em Lianja (pgina, seo, Gadget, e Campo) tem um estilo CSS que pode ser especificado no dilogo atributos. Voc especifica atributos CSS, da mesma forma como faria ao definir estilos html, no entanto estilos CSS tambm pode ser aplicado propriedade de estilo em todas as classes Framework Lianja aplicativo.

Personalizando uma Seo


Para personalizar a aparncia das sees, clique duas vezes no cabealho Seo e da Seo de dilogo Atributos ir deslizar dentro Alterar ottulo da seo para os clientes, em seguida, repita o mesmo processo para a seo de encomendas ea seo order_details.

Note-se que o formulrio barra de ferramentas tambm permite que voc personalizar o layout das sees.

Pronto para ser executado


Agora, a pgina deve ser semelhante a este.

Se precisar de mais espao na tela na concepo das pginas voc pode ocultar a barra lateral e Modebar usando o menu Exibir no menu do sistema Pages.

Runtime vista
Para visualizar o aplicativo em vista Runtime, basta clicar no cone de exibio de tempo de execuo no Headerbar.

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 viso de desenvolvimento


Agora voc v o App a correr! to simples como isso. Voc pode mover entre os registros usando os controles de navegao na Actionbar. Para voltar vista de Desenvolvimento basta clicar no cone no Headerbar.

Observe o cone de tela cheia de alternncia para a esquerda do Instant Search. Isso permite que aplicativos Lianja para executar em tela cheia sem bordas da janela. Perfeito para equipamentos de informao e caixas de TV set-top. A exibio do cone activado / desactivado nos Atributos da pgina.

Parte2

Lianja App Builder - Primeiros Passos (parte 2) Pesquisar banco de dados Made Easy
Pesquisa instantnea
Observe que no headerbar pgina h uma caixa de pesquisa que oferece pesquisa instantnea atravs dos dados que esto sendo exibidos na pgina. Para usar a pesquisa instante em que voc precisa especificar qual campo na pgina o campo de pesquisa. Para fazer isso, clique duas vezes sobre a legenda do campo que voc deseja usar.

Campo de pesquisa
O Campo de dilogo Atributos ir deslizar da direita. Desa at a seo Dados de sub-e clique na caixa campo de pesquisa, em seguida, clique em Concludo.

Usando a Pesquisa Instantnea


O campo de pesquisa ser indicado por um cone de chave a ser exibido esquerda de sua legenda. Digitar qualquer texto na caixa de pesquisa instantnea ir agora recuperar instantaneamente o primeiro registro que corresponde ao valor de chave de busca. Os controles de navegao 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 instantnea e todos os registros estaro disponveis novamente.

Note que voc pode ocultar o cone do campo de pesquisa em tempo de execuo a partir do dilogo Atributos Seo.

Selees instantneas
Outro recurso built-in poderoso de todas as pginas que voc projeto Selees instantneas. Se voc est familiarizado com as etiquetas do Gmail do Google, ento voc vai se sentir em casa com selees instantneas - uma vez criado, eles permitem que voc para restringir os dados mostrados com um nico clique. Selees instantneas realizar uma pesquisa de texto completo em todos os campos em seus registros de banco de dados, mas no h necessidade de criar os ndices especiais ou executar uma operao de consulta de banco de dados (SQL ou no). Para adicionar uma Seleo instantnea para sua pgina (voc pode ter diferentes Selees imediatas para cada pgina que compe sua app) basta clicar no boto +na parte inferior da barra lateral esquerda.

Selees instantneas so dependentes pgina que lhe permite ter pontos de vista diferentes dos dados, dependendo da

pgina que voc est visualizando

Criando uma Seleo instantnea


Criar uma caixa de dilogo Seleo vai deslizar a partir do lado esquerdo da janela principal. Decidir sobre a cor do rtulo e legenda para a sua Seleo instantnea, em seguida, especificar o texto a pesquisar - neste caso, a Seleo instantnea ir escolher apenas os registros que contenham "EUA".

Selees instantneas 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 condio de consulta.

Usando uma Seleo instantnea


Ativar um "Seleo instantnea", clicando em seu rtulo na barra lateral esquerda. O nmero de registros correspondentes a Seleo instantnea mostrada no topo da pgina ao lado de seu rtulo e os botes de navegao no movimento actionbar atravs dos registros correspondentes. Voc pode desativar a seleo, clicando no rtulo "Todos".

Aqui est a Seleo instantnea na Vista Runtime.

Observe tambm, 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.

Parte 3

Lianja App Builder - Primeiros Passos (parte 3) Estendendo seu primeiro aplicativo
Adicionando uma nova pgina
Agora vamos incrementar o app atravs da construo de uma pgina adicional que fornece informaes sobre os funcionrios. Criar uma nova pgina em branco, clicando no cone de pgina nas ferramentas de formulrio. Se voc receber uma seo de formulrio embranco criado para voc por padro com a pgina - isso determinado pelas configuraes do aplicativo (Definies na parte inferior do Modebar) - clique no cone de lixeira no cabealho de seo para remov-lo, como fazemos no precisa.

Em vez de remover a seo formulrio padro, voc pode adicionar a seo Faixa de imagem como abaixo e clique na imagem de cabealho de seo Strip e arraste-o sobre o cabealho da seo Formulrio para trocar a ordem das duas sees.

Tiras de imagem
Agora clique no cone Sees nas ferramentas de formulrio e selecionar a Faixa de Imagem.

Observe o Webview tambm. Isso permite que qualquer contedo da web para ser processado em uma seo. O URI especificado pode conter referncias a registros de dados ativos de outras sees. Para fazer referncia a dados na URI por exemplo chaves uso encaracolados {} CUSTOMERS.NAME. Isso permite que o contedo da web para ser relacionada aos dados do banco de dados.

Preencher uma Faixa de Imagem


Agora clique na tabela de funcionrios no painel Tabelas, em seguida, clique no campo de fotografia e arrast-lo para a seo Faixa de imagemque voc criou na etapa anterior.

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

Adicionar uma seo Formulrio Adicional

Agora clique em Sees nas ferramentas de formulrio e selecione Form. A seco de nova forma ser adicionado pgina. Agora clique na tabela defuncionrios, como mostrado abaixo e arraste-o para a nova seo que voc acabou de criar (ou apenas arraste a tabela para uma rea vazia da pgina.

Personalizao de campos seo de formulrio


A legenda para os campos na seo formulrio pode ser personalizado movendo o cursor do mouse sobre o ttulo e clicar no cone de edio.

Voc pode remover campos que voc no deseja que estejam visveis, clicando no cone de excluso, que exibido.

Divisores
Clique e arraste a ala azul no centro da borda inferior da seo selecionada para redimension-lo. Campos em uma seo de formulrio pode ser clicado e arrastado para alterar a exibio de encomenda. Voc tambm pode adicionar legendas, separadores horizontais, divisores de coluna ou espaadores para a seo clicando no cone Divisores nas ferramentas de formulrio. Uma vez que a legenda exibida na forma seo voc pode arrast-la em uma posio adequada.

Legendas horizontais so legendas que podem ser colocados em qualquer lugar no formulrio. Divisores de coluna so legendas horizontais na parte superior de uma coluna vertical. Separadores horizontais exibidos como uma linha horizontal, ao passo que espaadores so usados para proporcionar um espao em branco entre campos ou outros controlos.

Divisores de personalizao
Adicionar 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.

Ricos Editores de Texto


Agora adicione outra seo do formulrio e arraste no campo Notas empregado como mostrado abaixo. Por padro, o campo de comprimento (memorando) Notas varivel exibido em um editor de texto rico.

Sees Personalizando
Voc pode personalizar a aparncia de sees usando a seo de atributos de dilogo clicando duas vezes sobre o cabealho de seo ou clicando no cone cog. Definir a legenda para cada uma das trs sees.

Relativas aos pontos Faixa de Imagem


Agora relacionar a seo Faixa de Imagem (vrios registros funcionrios) para a seo Form (detalhes para registros individuais empregados).

Note que voc pode se relacionar sees juntas mesmo que contenham dados da tabela mesmo banco de dados. Tome um outro olhar para o seu aplicativo na Vista Runtime.

Parte 4

Lianja App Builder - Introduo (parte 4)


Colees pgina
Voc agora deve ter duas pginas em seu aplicativo. Voc pode construir como muitos como voc deseja. Voc pode agrupar pginas em grupos lgicos (menus), criando uma coleo de Page. Criar uma coleo Pgina denominado Admin como mostrado abaixo.

Para adicionar pginas em uma coleo de pgina, basta clicar sobre o ttulo da pgina na headerbar Page e arraste o ttulo em cima do botoPage Coleo.

Acessando as pginas de uma coleo Pgina


Agora, como voc pode ver abaixo as duas pginas Clientes e funcionrios so agora agrupados na Coleo pgina de administrao.

No menu da pgina tambm podem ser exibidos na barra lateral esquerda. Clique duas vezes no Headerbar ou clique no boto engrenagens para acessar os atributos de pgina e verifique o atributo Mostrar Menu.

Igualmente, voc pode configurar se o menu de navegao ser mostrado no Headerbar. Esta uma configurao Applarga, ento clique no botoConfiguraes na parte inferior da Modebar para acessar as configuraes do aplicativo.

Se voc deseja mover as pginas de um Page Coleo basta arrastar e solt-los de volta para o Headerbar. Voc tambm pode reordenar pginasdo conjunto de pgina arrastando-os na Headerbar seguida, de volta para a coleo.

Note que o boto direito sobre o ttulo Page Coleo permite renomear ou apagar a coleo.

Executando o aplicativo concludo


Agora voc tem um aplicativo que consiste em duas pginas. Clique no cone de vista de tempo de execuo e executar o aplicativo concludo. to simples quanto isso!

FIM.....

Das könnte Ihnen auch gefallen