Widget to count the amount of nested widget tree, useful in the dynamic construction of the interface when it is important to know the depth of widget.

Overview

widget_tree_depth_counter

Widget Tree Depth Counter

Pub Package likes popularity pub points

Package Issue Package License

WidgetTreeDepthCounter is a simple widget to count the amount of nested widget tree, useful in the dynamic construction of the interface when it is important to know the depth of widget.

Image
WidgetTreeDepthCounter

Features

  • count of the depth of the widget with respect to the tree (all uses of WidgetTreeDepthCounter in the current tree are counted, the other types of widgets are not counted)

This widget can be used conveniently in such cases:

  • Dynamically manage the colors of widgets based on their position in the tree

  • in an app that manages chapter numbers it is very easy to renumber them in case a chapter is removed.

  • ...

    Many other cases where it is very difficult to manage a widget through fixed parameters to be managed based on the construction of the tree.

 

Usage

Make sure to check out the examples on GitHub.

Image
Example of operation in a widget tree

Installation

From pubspec.yaml

Add the following line to pubspec.yaml:

dependencies:
  widget_tree_depth_counter: <last-release>

and

flutter pub get

From cli

run following command:

flutter pub add provider

Basic setup

Complete example available here.

ParentWidget(
  child: WidgetTreeDepthCounter(
    builder: (context, counter) => //counter=0
      Container(
        color: Theme.of(context)
          .primaryColor
          .withOpacity(counter * 0.05 + 0.05),
          child: WidgetTreeDepthCounter(
            builder: (context, counter) =>//counter=1
                Container(
                    color: Theme.of(context)
                    .primaryColor
                        .withOpacity(counter * 0.05 + 0.05),
                ),
          ),
      ),
  ),
),

WidgetTreeDepthCounter Properties

  • builder: Function called at layout time to construct the widget tree, return Widget.
  • count: With this parameter it's possible define or overwrite the current depth count value.

 

Use current counter value during build WidgetTreeDepthCounter

WidgetTreeDepthCounter uses Provider library to count the depth, but if it is necessary to access the current value to perform a sum (for example), it is possible to retrieve the count value through the `Provider 'functions:

WidgetTreeDepthCounter(
			count: context.read<DepthCounter>().value + 2,
            builder: (context, counter) =>
                Text(counter.toString()),
          )

Obviously to access the value via context.read<DepthCounter>() it is necessary that at least one WidgetTreeDepthCounter is present in the tree and provider package is required.

 

You might also like...

A Marvel Heroes and Comics guide, built with Flutter and MarvelAPI to help people get to know more about this amazing universe

A Marvel Heroes and Comics guide, built with Flutter and MarvelAPI to help people get to know more about this amazing universe

📱 Marvel Guide 📚 💻 Project A Marvel Heroes and Comics guide, built with Flutter and MarvelAPI to help people get to know more about this amazing un

Aug 30, 2022

A Flutter package used to update widget tree dynamically

A Flutter package used to update widget tree dynamically

简体中文|English Fair is a lightweight package for Flutter, which can be used to update widget tree and state dynamically. This package is still at an ear

Dec 30, 2022

Aris keyunique - Use the Flutter Unique Key To Preserve the state of Stateful Widgets if they moved around in the Widget tree

Aris keyunique - Use the Flutter Unique Key To Preserve the state of Stateful Widgets if they moved around in the Widget tree

Flutter Tutorial - Flutter Keys - Unique Key Use the Flutter Unique Key To Prese

Dec 29, 2021

Achieve ~60 FPS, no matter how heavy the tree is to build/layout

Achieve ~60 FPS, no matter how heavy the tree is to build/layout

flutter_smooth Achieve ~60 FPS, no matter how heavy the tree is to build/layout. 🎼 3-second video output_small.mp4 (left = without smooth, right = sm

Jan 9, 2023

This is an auction application just like eBay. Using firebase as the backend for signup & sign-in functionality. In addition to that, it's a two pages application with user bid in input and count down view.

This is an auction application just like eBay. Using firebase as the backend for signup & sign-in functionality.  In addition to that, it's a two pages application with user bid in input and count down view.

Nilam This is an auction application just like eBay. Using firebase as the backend for signup & sign-in functionality. In addition to that, it's a two

Nov 9, 2022

Flutter Bidirectional ListView - ListView with items that can be scrolled in both directions with a fixed item count and scroll boundaries.

Flutter Bidirectional ListView - ListView with items that can be scrolled in both directions with a fixed item count and scroll boundaries.

Flutter Bidirectional ListView ListView with items that can be scrolled and lazy loaded in up and down direction with a fixed item count and scroll bo

May 30, 2022

Arispewdie - Flutter app to watch LIVE subscriber count of PewDiePie vs T-Series

Arispewdie - Flutter app to watch LIVE subscriber count of PewDiePie vs T-Series

PewDiePie VS T-Series Flutter app to watch LIVE subscriber count of PewDiePie vs

Jan 10, 2022

This library allows you to create editable tables and spreadsheets with ease, either by providing initial row and column count to display an empty table or use it with predefined rows and column data sets.

This library allows you to create editable tables and spreadsheets with ease, either by providing initial row and column count to display an empty table or use it with predefined rows and column data sets.

Editable ⚡️ A highly customizable, editable table package for Flutter projects. Specs This package allows you to create editable tables and spreadshee

Dec 7, 2022

Boozin fitness - A sample app to that will pull data from Google Fit to get the steps count and calories burned

boozin_fitness A sample app to that will pull data from Google Fit to get the st

Nov 23, 2022
Releases(v1.0.1)
Owner
Riccardo Cucia
A good programmer looks both ways before crossing a one-way street.
Riccardo Cucia
Dynamic var - Dart dilinde dynamic ve var veri tiplerini anlamanızı kolaylaştıracak örnektir.

dynamic ve var arasındaki fark dynamic Tanımlanan değişkenin tipi daha sonra kod içerisinde değişebilir. Örneğin int olarak tanımlanan bir a değişkeni

Abdullah Sevmez 0 Jan 1, 2022
Flut cal - A flutter app for Calculating bill amount and Tips

flut_cal A flutter app for Calculating bills amount and Tips Getting Started To

John Paul Kpantey 1 Jan 5, 2022
A 3D pushable button built in Flutter. Ideal for important CTAs in the app.

Pushable Button A 3D pushable button built in Flutter. Ideal for important CTAs in the app. Usage PushableButton( child: Text('ENROLL NOW', style: s

Andrea Bizzotto 18 May 14, 2022
A flutter app to practice some common and important widgets

Flutter Beginner 2 A flutter app to practice some common and important widgets Developer Alexander Sosa (https://www.linkedin.com/in/alexander-sosa-as

Alexander Sosa 0 Jan 3, 2022
Flutter-Shared-Preference - The goal is to learn how to use the shared preferences plugin to save important pieces of information to your device.

Recipe Finder The goal is to learn how to use the shared preferences plugin to save important pieces of information to your device. Final App UI Resou

Ashirbad Swain 1 Jan 1, 2022
Flutter file based routing - File based routing and nested layouts for Flutter

Flutter File Based Routing I was inspired by the routing in remix.run with neste

Rody Davis 10 Sep 29, 2022
First Flutter Project using StateFull,Important Widgets,proberties,actions

first_project A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if

Ahmed Hossny 1 Jan 8, 2022
Know where to go safely. Describe your experiences and rate places.

Is It Safe? ?? Índice Sobre Showcase Features Como eu posso rodar o projeto? Ferramentas Instalação Run Suporte Como posso contribuir? Autores Info ??

Is It Safe? 0 Sep 19, 2022
Succu - This is a flutter app that makes it a breeze to know your pet plant more.

succu This is a flutter app that makes it a breeze to know your pet plant more. Are you struggling to keep your succulents alive? Or maybe you’re just

Francis Miguel A. Herlaban 81 Dec 13, 2022
Know what is happening around you with RealTime News

Know what is happening around you with RealTime News

Akindoyin Faruq 2 Jul 12, 2022