itemBuilder property
Returns a widget for the treemap tile based on the index.
A treemap item builder displays icons, images and text in the treemap tiles and customizes their position.
By default , widget will be align top left of the tile. If we need to customize it, the Align widget can be wrapped and aligned.
late List<SocialMediaUsers> _socialMediaUsersData;
@override
void initState() {
_socialMediaUsersData = <SocialMediaUsers>[
SocialMediaUsers('India', 'Facebook', 280),
SocialMediaUsers('India', 'Instagram', 88),
SocialMediaUsers('USA', 'Facebook', 190),
SocialMediaUsers('USA', 'Instagram', 120),
SocialMediaUsers('Japan', 'Twitter', 48),
SocialMediaUsers('Japan', 'Instagram', 31),
];
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SfTreemap(
dataCount: _socialMediaUsersData.length,
weightValueMapper: (int index) {
return _socialMediaUsersData[index].usersInMillions;
},
levels: [
TreemapLevel(
padding: EdgeInsets.all(2),
groupMapper: (int index) {
return _socialMediaUsersData[index].country;
},
color: Colors.red,
itemBuilder: (BuildContext context, TreemapTile tile) {
return Icon(Icons.mobile_friendly);
}),
],
),
);
}
class SocialMediaUsers {
const SocialMediaUsers(
this.country,
this.socialMedia,
this.usersInMillions,
);
final String country;
final String socialMedia;
final double usersInMillions;
}
See also:
- TreemapLevel.labelBuilder, for showing the additional information about the tile.
Implementation
final TreemapTileWidgetBuilder? itemBuilder;