View Outline

Besides the view border there is also another way to emphasize the shape of the view which is called an outline. It is represented by four attributes like style, width, color and an offset. Below is the schematic view of the outline.

It can be drawn outside or inside of the view shape using a positive or negative values of the offset. The outline is displayed above the view content it corresponds to. Compared to the view border we can't control each side of the outline independently. The outline does not take up space in the layout, unlike the view border.

To manipulate outline attributes we can use the following view properties:

The "outline" property is a generic one and holds the value of the OutlineProperty interface. An instance of that interface can be created using the global rui.NewOutlineProperty() function:

Go

func NewOutlineProperty(params rui.Params) rui.OutlineProperty

where Params is a map which can contain the following properties:

The style of the outline can have one of the following accepted values:

Example

Setting a view outline using the "outline" property.

Go

view.Set(rui.Outline, rui.NewOutlineProperty(rui.Params{
    rui.Style:   rui.SolidLine,
    rui.Width:   rui.Px(2),
    rui.Color:   rui.LightGray,
}))

When setting this property in resource description file it has a dedicated object format:

RUI

_{
    style = <style>,
    width = <width>,
    color = <color>,
}

where <style>, <width>, and <color> are the outline attributes values.

Example

Setting the view outline from resource description file.

RUI

GridLayout {
    width = 100%,
    height = 100%,
    // Center content on the screen
    cell-horizontal-align = center,
    cell-vertical-align = center,
    // Use plain View as a child
    content = View {
        width = 100px,
        height = 30px,
        // Setting an outline attributes
        outline = _{
            style = solid,
            width = 2px,
            color = lightgray,
        }
        outline-offset = 1px,
    }
}

Here is how the above example will look like:

To read the actual values of the view outline we can use ViewOutline() method of the OutlineProperty interface:

Go

switch outlineProp := view.Get(rui.Outline).(type) {
case rui.OutlineProperty:
    outline := outlineProp.ViewOutline(session)
    // Do something with the values
}

The ViewOutline() method will return values in a form of ViewOutline structure. Another way of getting these values is by using the global function rui.GetOutline():

Go

outline := rui.GetOutline(view, "view-id")
// Do something with the values

In this case there is no need to perform a type conversion or resolving a possible constant, everything is done behind the scene.

The rui.ViewOutline and rui.ViewBorder structures can be passed as "outline" property value to the Set() function of the view or during the view construction. Values of the rui.ViewOutline and rui.ViewBorder types will be converted to the OutlineProperty during assignment.

Examples

Go

// Setting outline attributes using ViewOutline as a value
view.Set(rui.Outline, rui.ViewOutline{
    Style: rui.SolidLine,
    Width: rui.Px(2),
    Color: rui.LightGray,
})

// Setting outline attributes using ViewBorder as a value
view.Set(rui.Outline, rui.ViewBorder{
    Style: rui.SolidLine,
    Width: rui.Px(2),
    Color: rui.Gray,
})

Go

// Setting outline attributes during the view construction
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.Content: rui.NewTextView(session, rui.Params{
        rui.Text: "Some text",
        // Use ViewOutline as a value
        rui.Outline: rui.ViewOutline{
            Style: rui.SolidLine,
            Width: rui.Px(2),
            Color: rui.LightGray,
        },
    }),
})

Besides the "outline" property we can use other convenient properties:

When setting such properties library will check for existence of "outline" property first and will create it implicitly if not present, then set the corresponding values.

Outline offset from the view border is controlled by "outline-offset" property which is not part of the OutlineProperty interface. As usual we can set or get the value using Set() and Get() methods of the view or set the value during the view construction. Library also provides a global function rui.GetOutlineOffset() to read the value without necessity manually converting the types:

Go

outlineOffset := rui.GetOutlineOffset(rootView, "view-id")
// Do something with the value

© Alxanosoft inc.