FLUTTER ECOSYSTEM

crizant/flutter_conditional_rendering

조건부 렌더링을 향상시키고 if-else 및 switch 조건을 지원하는 플러터 패키지입니다.

flutter_conditional_rendering 프로젝트 이미지
Stars
24
Forks
8
최근 푸시(UTC)
2024. 3. 5.
프로젝트 상태
활성
Crizant GitHub avatar
GITHUB User

Crizant ↗

언어Dart

이 저장소가 배포한 패키지

사용 중인 의존성

의존성 목록 2 개
  • flutter{"sdk":"flutter"}
  • flutter_test개발 의존성{"sdk":"flutter"}

원본 README

아래는 영문 원문 스냅샷입니다. 최신 내용은 GitHub에서 확인하세요.

README 펼치기 / 접기

flutter_conditional_rendering

A flutter package which enhances conditional rendering, supports if-else and switch conditions.

Why

In flutter if you want to do conditional rendering, you may do this:

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        if (someCondition == true)
          Text('The condition is true!'),
      ],
    );
  }
}

But what if you want to use a tertiary (if-else) condition?

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        someCondition == true ?
          Text('The condition is true!'):
          Text('The condition is false!'),
      ],
    );
  }
}

It is okay for a single Text widget, but the readability quickly become very bad when the child widget is multi-layered.

Usage

If-Else condition:
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Conditional.single(
          context: context,
          conditionBuilder: (BuildContext context) => someCondition == true,
          widgetBuilder: (BuildContext context) => Text('The condition is true!'),
          fallbackBuilder: (BuildContext context) => Text('The condition is false!'),
        ),
      ],
    );
  }
}
Switch condition:
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        ConditionalSwitch.single<String>(
          context: context,
          valueBuilder: (BuildContext context) => 'A',
          caseBuilders: {
            'A': (BuildContext context) => Text('The value is A!'),
            'B': (BuildContext context) => Text('The value is B!'),
          },
          fallbackBuilder: (BuildContext context) => Text('None of the cases matched!'),
        ),
      ],
    );
  }
}

Want a list of widgets?

If you want to conditionally render a list of widgets (List<Widget>) instead of a single one. Use Conditional.list() and ConditionalSwitch.list()!

Contributions

Feel free to contribute to this project.

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue. If you fixed a bug or implemented a feature, please send a pull request.