components_ui

Description:

components ui

Ui Dev tools components #
components_ui_devtools
A ideia principal é a componentização de widgets. Ou seja, os widgets mais usados do nosso desenvolvimento estaram de forma simples e dinamica para qualquer aplicação.
Primeiros passos #
Adicione ao seu pubspec.yaml o pacote

-- flutter pub add components_ui_devtools

ou no seu pubspec cole:
-components_ui:
---git:
-----url: https://github.com/davi-oliver/components_ui
No seu projeto #
import 'package:components_ui/src/kit_buttons.dart';
Requests Components
As requisições é feitas atraves do pacote http. O intuito é fazer com que a requisição possa retornar todo o status, data e exceptions que possa ter durante o acesso.
A forma escolhida para receber essas informações é feita atraves de json.
var _data = {
"requisicao_url": "$_url",
"tipo_requisicao": "GET",
"status_code": "${_requestGet.statusCode}",
"conexao": "$_resultConexao",
"mensagem": "Sucesso",
"retorno": "$_body",
};
copied to clipboard
Nesse exemplo temos o data de uma requisição GET.
Métodos de requisição #
A classe suporta os metodos HTTP como, GET/POST/PUT.
Implementação #
A implementação não foge do conceito basico de requisição http do pacote http, disponivel no pub.dev
await http.get(Uri.parse(_url)); // deve ser informado a url onde deseja-se requisitar OBS: método GET usuado para exemplificar
Como utilizar #
a utilização é simples, uma vez que importado o pacote, chame RequestComponents().metodo();
veja:
Future searchVideo() async {
var res = await RequestsComponents().getComParametros(
url: "https://www.googleapis.com/youtube/v3/search?",
param: "part=snippet&q=Jay%20Chou%20Mojito&key=[YOUR_API_KEY]");

var decodeDados = jsonDecode(res[0]);

}
copied to clipboard
para mais informações sobre esta classe: Ctrl + clique esquerdo sobre o nome da classe
UI Components & UX Desing
KitButtons()
Para as nossas classes de UI Kits usamos parametros que são objetivos para cada tipo de Widget.
Na classe KitButton temos:
- 'onTap' : que espera uma função,
- 'decoration': espera um BoxDecoration(),
- 'paddingButton': padding do botão,
- 'margingButton': margin do botão,
- 'heigth' & 'width': define o tamanho do botão,
- 'iconSufix'& 'iconPrefix': espera um Widget Icon(),
- 'iconPadding': espaçamento do icone,
- 'spaceIcons': é o espaçamento do icone em relação a um outro widget que esta na mesma linha, um iconSufix por exemplo;
- 'textStyle': estilização de texto,

KitButton(
width: MediaQuery.of(context).size.width * .8,
height: MediaQuery.of(context).size.height * .08,
widgetCenter: Text(
'Clique aqui',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w300,
fontSize: 25),
),
decorationButton: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.green[700]),
onTap: () async {

},
),
copied to clipboard
Exemple #