Extensão Custom List View

Extensão Custom List View

Fala pessoal, tudo bom?

No tutorial de hoje vamos conhecer uma extensão muito bacana, já falei em alguns vídeo o que são extensões mas vale relembrar o conceito.

Extensões são componentes desenvolvido por terceiros a fim de executar uma determinada função que a plataforma não disponibiliza nativamente. Estes componentes podem ser importados para sua aplicação através de um arquivo com extensão .aix.

Uma funcionalidade que fazia muita falta tanto no Thunkable quanto no App Inventor era a criação de conteúdo dinâmico personalizado. Quando precisávamos criar uma listagem, por exemplo, pegando informações de um banco de dados os únicos componentes disponíveis eram o ListPicker, ListView e Spinner. Porém elas não permitem (até o momento) uma personalização dos itens listados.

A extensão CustomListView desenvolvida por ColinTree nos dá esta possibilidade de uma forma muito simples e rápida. No vídeo abaixo eu mostro como utilizar esta extensão em uma aplicação. Neste tutorial eu me limitei a mostrar o básico do funcionamento do componente. Para fazer o download da extensão acesse o link http://aix.colintree.cn/en/extensions/ColinTreeListView.html 

 

 

Agora que já sabe como funciona a extensão, vamos ver um pouco mais sobre os seus blocos.

Eventos do componente: (alguns)

 

  • ElementClick: Captura o click em um determinado item da lista. Retorna a variável elementindex que é o índice (começando de um) do elemento selecionado.
  • ElementLongClick: Captura um clique longo em um determinado elemento da lista. Retorna o elementindex  que é o índice (começando de um) do elemento selecionado.
  • IconClick: Captura o clique no ícone configurado de determinado item da lista.
  • IconLongClick: Captura o clique longo no ícone configurado de um determinado item da lista

         

Métodos do componente e suas funções respectivamente:

  • Adiciona um novo elemento a lista
  • Adiciona um elemento vazio.
  • Limpa a lista
  • Recupera um elemento da lista pelo índice do mesmo.
  • Inicializa a lista em um layout sem scroll
  • Inicializa a lista em um layout com scroll
  • Remove um elemento da lista pelo índice do mesmo
  • Configura a lista inicial

Outros métodos:

  • Configura um elemento para uma determinada posição da lista
  • Configura um ícone para um determinado elemento pela posição.
  • Configura o texto principal de um determinado elemento pelo índice
  • Configura o texto secundário de um determinado elemento pelo índice
  • Configura o texto de um determinado elemento pelo índice

Por hoje é só pessoal, em breve volto com mais um tutorial sobre esta e outras extensões que eu for conhecendo e aprendendo a usar. Deixe nos comentários sua opinião sobre o tutorial 😉 e até a próxima.

 

Referencias

http://aix.colintree.cn/en/extensions/ColinTreeListView.html

https://community.thunkable.com/t/custom-listview-colintreelistview/11964?u=taifun

 

Admin bar avatar
Lucas Firmino
Desenvolvedor Web Back-end na Action! Soluções tecnológicas. Instrutor na empresa APP Inventor Brasil. Estudante do Curso de Bacharelado em Sistemas de Informação.

Comments: 8

    Admin bar avatar
    Admin bar avatar

Leave a comment