This package provides a widget which applies a paper fold effect on it's child. You can choose between horizontal and vertical fold direction. The number of strips has to be at least two.
Add paperfold
as a dependency in your pubspec.yaml file. Or run pub add paperfold
in your terminal.
Just add the widget to your tree and you're done :). Take a look at example to see more.
PaperFold(
mainAxis: PaperFoldMainAxis.vertical,
strips: 4,
foldValue: .5,
pixelRatio: 1,//works best if you query the device pixel ration with MediaQuery.of
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(20)),
child: Container(
color: Colors.green,
height: 150,
child: ListView.builder(
itemCount: 30,
itemBuilder: (context, index) {
return Column(
children: [
Row(
children: const [
Icon(
Icons.translate,
size: 50,
),
Text("hello world, hello world")
],
),
],
);
},
),
),
),
);
- User interactions (gestures etc.) with child only possible in unfold state. (0 <= fold value < 1)
- Child widgets can't be animated. This is also valid for videos. You can wrap it by the paperfold, but the content will not update in folded state.
Feel free to file any issues, bugs, or feature requests. All contributions are welcome :)
Special thanks to GwaedGlas for reviewing and sparring this package