ClipShapeProperty
Description of a View's clipping area
Create from source
func NewCircleClip(x, y, radius SizeUnit) ClipShapeProperty
Creates a circle view clipping area. x - x-axis position of the circle clip center, y - y-axis position of the circle clip center, radius - radius of the circle clip center.
func NewClipShapeProperty(shape ClipShape, params Params) ClipShapeProperty
Creates an object of clip shape property and returns it's interface. The following properties can be used for shapes. InsetClip: "top" (Top) - offset (SizeUnit) from the top border of a View, "right" (Right) - offset (SizeUnit) from the right border of a View, "bottom" (Bottom) - offset (SizeUnit) from the bottom border of a View, "left" (Left) - offset (SizeUnit) from the left border of a View, "radius" (Radius) - corner radius (RadiusProperty). CircleClip: "x" (X) - x-axis position (SizeUnit) of the circle clip center, "y" (Y) - y-axis position (SizeUnit) of the circle clip center, "radius" (Radius) - radius (SizeUnit) of the circle clip center. EllipseClip: "x" (X) - x-axis position (SizeUnit) of the ellipse clip center, "y" (Y) - y-axis position (SizeUnit) of the ellipse clip center, "radius-x" (RadiusX) - x-axis radius (SizeUnit) of the ellipse clip center, "radius-y" (RadiusY) - y-axis radius (SizeUnit) of the ellipse clip center. PolygonClip: "points" (Points) - an array ([]SizeUnit) of corner points of the polygon in the following order: x1, y1, x2, y2, …. The function will return nil if no properties were specified, or unsupported properties were specified, or at least one property has an invalid value.
func NewEllipseClip(x, y, rx, ry SizeUnit) ClipShapeProperty
Creates an ellipse view clipping area. x - x-axis position of the ellipse clip center, y - y-axis position of the ellipse clip center, rx - x-axis radius of the ellipse clip center, ry - y-axis radius of the ellipse clip center.
func NewInsetClip(top, right, bottom, left SizeUnit, radius RadiusProperty) ClipShapeProperty
Creates a rectangle view clipping area. top - offset from the top border of a view; right - offset from the right border of a view; bottom - offset from the bottom border of a view; left - offset from the left border of a view; radius - corner radius, pass nil if round corners are not needed
func NewPolygonClip(points []any) ClipShapeProperty
Creates a polygon view clipping area. points - an array of corner points of the polygon in the following order: x1, y1, x2, y2, … The elements of the points can be text constants, or text representation of SizeUnit, or elements of SizeUnit type.
func NewPolygonPointsClip(points []SizeUnit) ClipShapeProperty
Creates a polygon view clipping area. points - an array of corner points of the polygon in the following order: x1, y1, x2, y2, ….
Create from resource
View {
clip = circle {
x = 50%,
y = 50%,
radius = 50%,
},
}
View {
clip = ellipse {
x = 50%,
y = 50%,
radius-x = 50%,
radius-y = 30%,
},
}
View {
clip = inset {
top = 1px,
right = 2px,
bottom = 1px,
left = 2px,
},
}
View {
clip = polygon {
points = "1px, 1px, 10px, 1px, 10px, 10px, 1px, 10px",
},
}
Interface description
Inherit methods from Properties, fmt.Stringer
Shape() ClipShape
Returns the clip shape type
Properties
"bottom"
Specifies the bottom border position of inset clip shape
Constant: Bottom
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = inset {
top = 10%,
bottom = 10%,
left = 10%,
right = 10%,
radius = _{
x = 0.2em,
y = 0.2em,
}
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewInsetClip(
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.NewRadiusProperty(rui.Params{
rui.X: rui.Em(0.2),
rui.Y: rui.Em(0.2),
}),
),
}),
})
"left"
Specifies the left border position of inset clip shape
Constant: Left
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = inset {
top = 10%,
bottom = 10%,
left = 10%,
right = 10%,
radius = _{
x = 0.2em,
y = 0.2em,
}
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewInsetClip(
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.NewRadiusProperty(rui.Params{
rui.X: rui.Em(0.2),
rui.Y: rui.Em(0.2),
}),
),
}),
})
"points"
Points which describe polygon clip area. Values are in a sequence of pair like: x1, y1, x2, y2 ...
Constant: Points
Types: []SizeUnit, string
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = polygon {
points = "1px, 1px, 10px, 1px, 10px, 10px, 1px, 10px",
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewPolygonClip(
[]any{
rui.Px(1),
rui.Px(1),
rui.Px(10),
rui.Px(1),
rui.Px(10),
rui.Px(10),
rui.Px(1),
rui.Px(10),
},
),
}),
})
"radius"
Specifies the radius of the corners or the radius of the cropping area
Constant: Radius
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
background-color = lightsalmon,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = circle {
x = 50%,
y = 50%,
radius = 50%,
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewCircleClip(
rui.Percent(50),
rui.Percent(50),
rui.Percent(50),
),
}),
})
"radius-x"
Specifies the x-axis corners elliptic rounding radius of the elliptic clip shape
Constant: RadiusX
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
background-color = lightsalmon,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = ellipse {
x = 50%,
y = 50%,
radius-x = 50%,
radius-y = 30%,
},
},
}
view: = rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewEllipseClip(
rui.Percent(50),
rui.Percent(50),
rui.Percent(30),
rui.Percent(50),
),
}),
})
"radius-y"
Specifies the y-axis corners elliptic rounding radius of of the elliptic clip shape
Constant: RadiusY
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
background-color = lightsalmon,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = ellipse {
x = 50%,
y = 50%,
radius-x = 50%,
radius-y = 30%,
},
},
}
view: = rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewEllipseClip(
rui.Percent(50),
rui.Percent(50),
rui.Percent(30),
rui.Percent(50),
),
}),
})
"right"
Specifies the right border position of inset clip shape
Constant: Right
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = inset {
top = 10%,
bottom = 10%,
left = 10%,
right = 10%,
radius = _{
x = 0.2em,
y = 0.2em,
}
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewInsetClip(
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.NewRadiusProperty(rui.Params{
rui.X: rui.Em(0.2),
rui.Y: rui.Em(0.2),
}),
),
}),
})
"top"
Specifies the top border position of inset clip shape
Constant: Top
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = inset {
top = 10%,
bottom = 10%,
left = 10%,
right = 10%,
radius = _{
x = 0.2em,
y = 0.2em,
}
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewInsetClip(
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.Percent(10),
rui.NewRadiusProperty(rui.Params{
rui.X: rui.Em(0.2),
rui.Y: rui.Em(0.2),
}),
),
}),
})
"x"
Specifies x-axis position of the clip shape
Constant: X
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
background-color = lightsalmon,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = circle {
x = 50%,
y = 50%,
radius = 50%,
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewCircleClip(
rui.Percent(50),
rui.Percent(50),
rui.Percent(50),
),
}),
})
"y"
Specifies y-axis position of the clip shape
Constant: Y
Types: SizeUnit, SizeFunc, string, float, int
Internal type is SizeUnit, other types converted to it during assignment
See SizeUnit description for more details
Examples
GridLayout {
width = 100%,
height = 100%,
cell-vertical-align = center,
cell-horizontal-align = center,
background-color = lightsalmon,
content = ImageView {
width = 5em,
height = 5em,
src = "avatar.png",
fit = cover,
clip = circle {
x = 50%,
y = 50%,
radius = 50%,
},
},
}
view := rui.NewGridLayout(session, rui.Params{
rui.Width: rui.Percent(100),
rui.Height: rui.Percent(100),
rui.CellHorizontalAlign: rui.CenterAlign,
rui.CellVerticalAlign: rui.CenterAlign,
rui.BackgroundColor: rui.LightSalmon,
rui.Content: rui.NewImageView(session, rui.Params{
rui.Width: rui.Em(5),
rui.Height: rui.Em(5),
rui.Fit: rui.CoverFit,
rui.Source: "avatar.png",
rui.Clip: rui.NewCircleClip(
rui.Percent(50),
rui.Percent(50),
rui.Percent(50),
),
}),
})
Related global functions
func GetClip(view View, subviewID ...string) ClipShapeProperty
Returns a view clipping area. If the second argument (subviewID) is not specified or is an empty string then a top position of the first argument (view) is returned
func GetShapeOutside(view View, subviewID ...string) ClipShapeProperty
Returns a shape around which adjacent inline content. If the second argument (subviewID) is not specified or is an empty string then a top position of the first argument (view) is returned