Em aplicações móveis o fluxo de trabalho dos componentes Image é um pouco diferente do fluxo de trabalho em aplicações web. Este artigo descreve em pormenor como utilizar Image componente em aplicação móvel. Na repetição de elementos, tais como elementos da List e Grid componentes, carregando o Image do modelo de dados não é inequívoco e requer um certo procedimento de carregamento utilizando a BP.
Image utilização de componentes na repetição de elementos (List/Grid)
Vejamos um exemplo em que temos mesa de voo e cada objecto de voo tem a sua própria capa representada pelo ImageFile campo [file].
Imagine que a lista de voos é representada com o List componente. Cada elemento do List componente - é um Card componente contendo Image e alguns outros componentes para exibir informações de voo relevantes. No UI designer tem o seguinte aspecto:
Primeiro que tudo, Data Source tem de ser especificado para a componente principal (List componente, neste caso).
Para carregar os dados da base de dados para a Image componente, precisamos de criar um novo processo empresarial para a Image componente.
A BP requerida começa com a criação de um elemento de imagem na aplicação, nomeadamente a onCreate gatilho. Em primeiro lugar, é necessário receber o objecto de modelo de dados correspondente à imagem dada. Para tal, é possível utilizar os dados que já são recebidos pelo elemento pai (List neste caso). Para obter dados de um List, o List Get Data é utilizado um bloco.
A lógica da BP que estamos a construir é a seguinte: se um dos Data elementos da matriz (flight modelo de objecto) tem um identificador (ID) igual a Record IDEncontrámos então o elemento de mesa de voo de que necessitamos. Depois, o ficheiro de imagem ID é retirado do objecto do modelo de voo e carregado na componente Imagem com o necessário Widget ID.
Para iterar sobre todos os elementos do Data matriz, o For each loop É utilizado bloco de BP, e, no corpo do laço, cada elemento do Data é expandido utilizando o Expand Flight bloco. Se Flight ID = Record IDentão a ImageFile identificador de ficheiro é tirado e o objecto de ficheiro é carregado utilizando o Server request GET /_files/:id/download/ bloco. Exemplo da BP correspondente, como se segue.
No passo seguinte, o ficheiro de imagem é expandido utilizando o Expand file bloco para passar a matriz de bytes como entrada para o Image Update Properties blocos Data propriedade. É também necessário especificar o Widget ID de um elemento específico da imagem na folha, passando-lhe o valor do bloco onCreate no início da BP. O resultado da última parte da BP é mostrado no exemplo abaixo:
No final, o Break Loop é utilizado para não iterar em vão sobre os restantes elementos da matriz.
Carregar uma imagem do sistema de ficheiros do smartphone do utilizador
Considere um exemplo de carregamento de um avatar de perfil de utilizador. A interface web consiste de uma imagem e um botão que lança o BP, e tem este aspecto:
Depois, o BP relevante permite ao utilizador seleccionar os ficheiros do seu dispositivo com a utilização de Select Files bloco. E se os ficheiros forem seleccionados com sucesso, o elemento com index = 0 é tomada. Parece que a BP correspondente:
O elemento do ficheiro resultante do Files deve ser carregada para o servidor de aplicações web para utilização posterior (Server request POST /_files/). Se o pedido for bem sucedido, o objecto do ficheiro à saída do Server request POST /_files/ bloco é passado para a entrada do Expand file bloco para obter um Bytes Arrayque é passado para a entrada do Image Update Properties bloco no Data propriedade.
