star_menu 2.0.0+2 star_menu: ^2.0.0+2 copied to clipboard
Contextual popup menu with different shapes and multiple ways to fine-tune animation and position. The menu entries can be almost any kind of widgets.
StarMenu #
Contextual popup menu with different shapes and multiple ways to fine-tune animation and position. The menu entries can be almost any kind of widgets.
Every widgets can now popup a menu on tap! There are currently 3 shapes to choose:
linear
: items are lined by a given angle with a given space between them and with a 3-way alignment.circle
: items are lined up in a circle shape with a given radius and a star-end angle.grid
: items are aligned in a grid shape with N columns and a given horizontal and vertical shape.
Using the package is pretty simple:
- make your widget a child of StarMenu:
StarMenu(
params: StarMenuParameters(),
onItemTapped: (index, controller) {
if (index == 7)
controller.closeMenu();
}
),
items: entries,
child: FloatingActionButton(
onPressed: () {print('FloatingActionButton tapped');},
child: Icon(Icons.looks_one),
),
)
- add the provided addStarMenu() Widget extension to your widget:
FloatingActionButton(
onPressed: () {print('FloatingActionButton tapped');},
child: Icon(Icons.looks_one),
).addStarMenu(context, entries, StarMenuParameters()),
where entries
is a List<Widget>
for the menu entries and StarMenuParameters()
is defined as follow:
Name | Type | Description |
---|---|---|
shape | enum | Menu shape kind. Could be [MenuShape.circle], [MenuShape.linear], [MenuShape.grid]. |
linearShapeParams | class | See below. |
circleShapeParams | class | See below. |
gridShapeParams | class | See below. |
backgroundParams | class | See below. |
openDurationMs | int | Open animation duration. |
closeDurationMs | int | Close animation duration. |
rotateItemsAnimationAngle | double | Starting rotation angle of the items that will reach 0 DEG when animation ends. |
startItemScaleAnimation | double | Starting scale of the items that will reach 1 when animation ends. |
centerOffset | Offset | Shift offset of menu center from the center of parent widget. |
useScreenCenter | bool | Use the screen center instead of parent widget center. |
checkItemsScreenBoundaries | bool | Checks if the whole menu boundaries exceed screen edges, if so set it in place to be all visible. |
checkMenuScreenBoundaries | bool | Checks if items exceed screen edges, if so set them in place to be visible. |
animationCurve | Curve | Animation curve kind to use. |
onItemTapped | Function | The callback that is called when a menu item is tapped. It gives the ID of the item and a controller to eventually close the menu. |
LinearShapeParams
Name | Type | Description |
---|---|---|
angle | double | Degree angle. Anticlockwise with 0° on 3 o'clock. |
space | double | Space between items. |
alignment | LinearAlignment | left, center, right, top, bottom. Useful when the linear shape is vertical or horizontal. |
CircleShapeParams
Name | Type | Description |
---|---|---|
radiusX | double | Horizontal radius. |
radiusY | double | Vertical radius. |
startAngle | double | Starting angle for the 1st item. Anticlockwise with 0° on the right. |
endAngle | double | Ending angle for the 1st item. Anticlockwise with 0° on the right. |
GridShapeParams
Name | Type | Description |
---|---|---|
columns | int | Number of columns. |
columnsSpaceH | int | Horizontal space between items. |
columnsSpaceV | int | Vertical space between items. |
BackgroundParams
Name | Type | Description |
---|---|---|
animatedBlur | bool | Animate background blur from 0.0 to sigma if true. |
sigmaX | double | Horizontal blur. |
sigmaY | double | Vertical blur. |
animatedBackgroundColor | bool | Animate [backgroundColor] from transparent if true. |
backgroundColor | Color | Background color. |