Examples

In this section of the documentation we present a few examples of resizing of buttons with Creative FL Vertical Menu. The graphical steps present here will not be visible while working with the product, but by watching these examples you can fully understand how the resizing works and use it with perfect result in your projects.

Below are four examples, two for horizontal resizing and two for vertical resizing; as working with advanced resizing system is more customizable and interesting, three of the four examples are done using this system.

Horizontal resizing

Automatic resize + solid color	Advanced resize + gradient
The shape will split in two, in its middle, the splitting default place for automatic resize.	You have to choose the cutting point ("xCutPoint"); as its a vertical gradient, you can choose it safely wherever you want.
The final size of the shape will be computed automatically, according to the situation, and a gap will appear starting from the middle.	The final size of the shape will be computed automatically, according to the situation, and a gap will appear starting from the cutting point.
The gap will be filled with 5-pixels-width slices.	The gap will be filled with slices of a specified width; the width has the value of the "xDuplicate" parameter.
The final, resized shape.	The final, resized shape.

Vertical resizing

Advanced resize + solid color	Advanced resize + gradient
The initial shape	The initial shape
You have to choose the cutting point ("yCutPoint"); as its a solid color, you can choose it safely wherever you want.	You have to choose the cutting point ("yCutPoint"); as its a vertical gradient, you have to choose it in an area with an uniform color on all the length.
The final size of the shape will be computed automatically, according to the situation, and a gap will appear starting from the cutting point.	The final size of the shape will be computed automatically, according to the situation, and a gap will appear starting from the cutting point.
The gap will be filled with slices of a specified width; the width has the value of the "yDuplicate" parameter.	The gap will be filled with slices of a specified width; the width has the value of the "yDuplicate" parameter. Because we are dealing with a gradient, a width of 1 pixel is recommended.
The final, resized shape.	The final, resized shape.