visiblity_data_manager

Description:

visiblity data manager

Visibility Data Manager #
Management data of visible widgets.
Overview #
This guide highlights the capabilities of the visibility_data_manager library, offering insights into its efficient use for monitoring widget visibility and managing data, related to the visible widgets. It demonstrates how to utilize the library effectively when users interact with scroll widgets within their respective parent widgets.
Key Features #


Visibility Monitoring: Easily track the visibility state of widgets within scrollable containers.


Track common data: Common data can depends of visible widgets.


Depend on common data: Manageble widgets can depend of common data changes.


Stock exchange order book: Real using of 'Depend on common data' scenario (in development).


Scenarios #
The showcase covers various scenarios, including:


Basic Scenario
Widget tracks own visiblity status


Track common data
Widgets notify visiblity manager of its visiblity and manager tracks common data


Depend on common data
'Widget data' connected to manageble widgets. Manager updates common data from data of visible widgets and notifies widgets with new common data


Stock exchange order book
Real using of 'Depend on common data' scenario (in developmet)


Basic Scenario #
https://github.com/Alienjob/visiblity_data_manager/tree/main/is_visible

Widget tracks own visiblity status.

The library provides State mixin that provides to widget currentVisible status and changeVisible stream.
Just wrap your ListView with VisiblityManagerIsVisible.isVisible:
class IsVisiblePage StatelessWidget {
@override
Widget build(BuildContext context) {
return VisiblityManagerIsVisible.isVisible(
child: ListView(
children: [
ItemWidget()
],),);
}
}
copied to clipboard
Then use IsVisible mixin in your items:
class ItemWidget extends StatefulWidget {
@override
State<ItemWidget> createState() => _ItemWidgetState();
}
class _ItemWidgetState extends State<ItemWidget> with IsVisible{
@override
Widget build(BuildContext context) {
return Card(
child: Text(
currentVisible?'visible':'invisible',
style: TextStyle(color: currentVisible?Colors.black:Colors.grey),
),);
}
}
copied to clipboard
Track common data Scenario #
https://github.com/Alienjob/visiblity_data_manager/tree/main/num_of_visible

Widgets notify visiblity manager of its visiblity and manager tracks common data

Implement store for common data
class NumOfVisibleStore extends VisiblityCommonDataStore<int> {
int numOfVisible = 0;

@override
void update(int num) {
if (numOfVisible != num) {
numOfVisible = num;
super.update(num);
}
}
}
copied to clipboard
In manager Widget init store:
class _NumOfVisibleState extends State<NumOfVisible> {
final store = NumOfVisibleStore();
copied to clipboard
Make onVisiblityChange function:
void onVisiblityChange<TCommon>(
{VisiblityCommonDataStore<TCommon>? dataStore,
required VisiblityStore visiblyStore}) {
if (dataStore is NumOfVisibleStore) {
(dataStore as NumOfVisibleStore)
.update(visiblyStore.getVisibleKeys().length);
}
}
copied to clipboard
Wrap your ListView with VisiblityManagerCommonData.commonData<TCommon>:
@override
Widget build(BuildContext context) {
return VisiblityManagerCommonData.commonData<int>(
store: store,
onChange: onVisiblityChange,
child: ListView(
children: items,
),);
}
}
copied to clipboard
Wrap your Item with VisiblityManageble, use keys when creating items:
void addItem() {
final Key key = UniqueKey();
items = List<Widget>.from([
...items,
Card(
child: VisiblityManageble(
key: key,
builder: () => Text(
'$key ${store.numOfVisible}',
),),)]);
setState(() {});
}
copied to clipboard
Depend on calculable data Scenario #
https://github.com/Alienjob/visiblity_data_manager/tree/main/calculable_data

'value data' connected to manageble widgets. Manager updates 'calculable data' from 'value data' of visible widgets and notifies widgets with new 'calculable data'

Implement store for calculable data
class MaxVisibleValueStore extends VisiblityCalculableDataStore<double, double> {
double maxValue = 0;

@override
double? calculate(List<Key> keys) {
maxValue = 0;
for (var key in keys){
maxValue = max(maxValue, registred[key]??0);
}
super.calculate(keys);
return maxValue;
}

@override
void update(double data) {
if (maxValue != data) {
maxValue = data;
super.update(data);
}
}
}
copied to clipboard
In manager Widget init store:
class _NumOfVisibleState extends State<NumOfVisible> {
final store = MaxVisibleValueStore();
copied to clipboard
Make onVisiblityChange function:
void onVisiblityChange<TValue, TCommon>({
VisiblityCalculableDataStore<TValue, TCommon>? dataStore,
required VisiblityStore visiblyStore
}) {
if (dataStore is MaxVisibleValueStore) {
final double? maxValue = (dataStore as MaxVisibleValueStore).calculate(visiblyStore.getVisibleKeys());
store.update(maxValue??0);
Future.delayed(Duration.zero, () async{ setState(() {});});
}
}
copied to clipboard
Wrap your ListView with VisiblityManagerCalculableData.calculable<TValue, TCommon>:
@override
Widget build(BuildContext context) {
return VisiblityManagerCalculableData.calculable<double, double>(
store: store,
onChange: onVisiblityChange,
child: ListView(
children: items,
),);
}
}
copied to clipboard
Wrap your Items with VisiblityManageble, set initValue use keys when creating them:
void addItem() {
double value = Random().nextDouble();
items = List<Widget>.from([
...items,
VisiblityManageble(
key: ValueKey(value),
initValue: value,
builder: () => Text('value: $value maxValue: ${store.maxValue}')
)
]);
setState(() {});
}
copied to clipboard
Stock exchange order book #
Preparing to publish
License #
This project is licensed under the MIT License. Refer to the LICENSE file for more details.