flutter_view_controller 0.0.1 copy "flutter_view_controller: ^0.0.1" to clipboard
flutter_view_controller: ^0.0.1 copied to clipboard

outdated

Pacote para construção de projetos flutter com padrão reativo.

Flutter View Controller #

Um estilo de arquitetura reativo que visa isolar a o comportamento dos componentes de sua vizualização. Focado no reaproveitamento, e composição recursiva de componentes.

Começando #

Adicioando é a dependencia #

No projeto:

dependencies:
  flutter_view_controller: ^0.0.1

Por comando:

flutter pub add flutter_view_controller

###Criando um componente Para cada componente crie dois arquivos. Um de controle e um de visualização.

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class MyController extends Controller {
  @override
  onInit(){}

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class MyView extends View<MyController> {
  MyView({required MyController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

Utilizando o componente #

  @override
  Widget build(BuildContext context) {
    return Container(
      child: MyComponentView(controller: MyComponentController())
    );
  }

Utilizando componentes em Hierarquia #

Componente Pai #

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class ParentController extends Controller {
  ChildController child = ChildController();

  @override
  onInit(){}

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class ParentView extends View<ParentController> {
  ParentView({required ParentController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: ChildView(controller: controller.child)
    );
  }
}

Componente Filho #

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class ChildController extends Controller {
  @override
  onInit(){}

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class ChildView extends View<ChildController> {
  ChildView({required ChildController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

Atualizando a view de forma reativa usando a classe Notifier #

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class MyController extends Controller {

  Notifier<bool> isLoading = Notifier(true);

  @override
  onInit(){
    ....someCode
    isLoading.value = false;
  }

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class MyView extends View<MyController> {
  MyView({required MyController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return controller.isLoading.show((isLoading)=>
      isLoading ? 
      Center(child: CircularProgressIndicator()):
      Text("Page has been loaded!")
    );
  }
}

Comunicação entre controllers usando a classe Plug #

Button #

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class ButtonController extends Controller {

  Notifier<bool> isSelected = Notifier(false);

  Plug onClick = Plug();

  @override
  onInit(){}

  click(){
    onClick();
  }

  select(){
    isSelected.value = true;
  }

  unselect(){
    isSelected.value = false;
  }

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class ButtonView extends View<ButtonController> {
  MyView({required ButtonController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: controller.click,
      child: Container(
        child: controller.isSelected.show((isSelected)=> Text(isSelected ? "Selected": "Unselected"))
      )
    )
  }
}

Button #

controller.dart

import 'package:flutter_view_controller/flutter_view_controller.dart';

class PageController extends Controller {
  ButtonController button1 = ButtonController();
  ButtonController button2 = ButtonController();

  @override
  onInit(){
    button1.onClick.then(()=> selectButton(button1));
    button2.onClick.then(()=> selectButton(button2));
  }

  _selectButton(ButtonController button){
    button1.unselect();
    button2.unselect();
    button.select();
  }

  @override
  onClose(){}
}

view.dart

import 'package:flutter/material.dart';
import 'package:flutter_view_controller/flutter_view_controller.dart';
import 'controller.dart';

class ButtonView extends View<ButtonController> {
  MyView({required ButtonController controller}) : super(controller: controller);

  @override
  Widget build(BuildContext context) {
    return Column(children:[
      ButtonView(controller: controller.button1),
      ButtonView(controller: controller.button2),
    ])
  }
}
6
likes
0
points
27
downloads

Publisher

unverified uploader

Weekly Downloads

Pacote para construção de projetos flutter com padrão reativo.

Repository (GitHub)
View/report issues

License

unknown (license)

Dependencies

flutter

More

Packages that depend on flutter_view_controller