gioui.org: gioui.org/widget/material Index | Files

package material

import "gioui.org/widget/material"

Package material implements the Material design.

To maximize reusability and visual flexibility, user interface controls are split into two parts: the stateful widget and the stateless drawing of it.

For example, widget.Button encapsulates the state and event handling of all buttons, while the Theme can draw a single Button in various styles.

This snippet defines a button that prints a message when clicked:

var gtx *layout.Context
button := new(widget.Button)

for button.Clicked(gtx) {
    fmt.Println("Clicked!")
}

Use a Theme to draw the button:

theme := material.NewTheme(...)

th.Button("Click me!").Layout(gtx, button)

Customization

Quite often, a program needs to customize the theme provided defaults. Several options are available, depending on the nature of the change:

Mandatory parameters: Some parameters are not part of the widget state but have no obvious default. In the program above, the button text is a parameter to the Theme.Button method.

Theme-global parameters: For changing the look of all widgets drawn with a particular theme, adjust the `Theme` fields:

theme.Color.Primary = color.RGBA{...}

Widget-local parameters: For changing the look of a particular widget, adjust the widget specific theme object:

btn := th.Button("Click me!")
btn.Font.Style = text.Italic
btn.Layout(gtx)

Widget variants: A widget can have several distinct representations even though the underlying state is the same. A widget.Button can be drawn as a round icon button:

icon := material.NewIcon(...)

th.IconButton(icon).Layout(gtx, button)

Specialized widgets: Theme both define a generic Label method that takes a text size, and specialized methods for standard text sizes such as Theme.H1 and Theme.Body2.

Index

Package Files

button.go checkable.go checkbox.go doc.go editor.go icon.go image.go label.go radiobutton.go theme.go

type Button Uses

type Button struct {
    Text string
    // Color is the text color.
    Color        color.RGBA
    Font         text.Font
    Background   color.RGBA
    CornerRadius unit.Value
    // contains filtered or unexported fields
}

func (Button) Layout Uses

func (b Button) Layout(gtx *layout.Context, button *widget.Button)

type CheckBox Uses

type CheckBox struct {
    // contains filtered or unexported fields
}

func (CheckBox) Layout Uses

func (c CheckBox) Layout(gtx *layout.Context, checkBox *widget.CheckBox)

type Editor Uses

type Editor struct {
    Font text.Font
    // Color is the text color.
    Color color.RGBA
    // Hint contains the text displayed when the editor is empty.
    Hint string
    // HintColor is the color of hint text.
    HintColor color.RGBA
    // contains filtered or unexported fields
}

func (Editor) Layout Uses

func (e Editor) Layout(gtx *layout.Context, editor *widget.Editor)

type Icon Uses

type Icon struct {
    Color color.RGBA
    // contains filtered or unexported fields
}

func NewIcon Uses

func NewIcon(data []byte) (*Icon, error)

NewIcon returns a new Icon from IconVG data.

func (*Icon) Layout Uses

func (ic *Icon) Layout(gtx *layout.Context, sz unit.Value)

type IconButton Uses

type IconButton struct {
    Background color.RGBA
    Color      color.RGBA
    Icon       *Icon
    Size       unit.Value
    Padding    unit.Value
}

func (IconButton) Layout Uses

func (b IconButton) Layout(gtx *layout.Context, button *widget.Button)

type Image Uses

type Image struct {
    // Src is the image to display.
    Src paint.ImageOp
    // Scale is the ratio of image pixels to
    // dps.
    Scale float32
}

Image is a widget that displays an image.

func (Image) Layout Uses

func (im Image) Layout(gtx *layout.Context)

type Label Uses

type Label struct {
    // Face defines the text style.
    Font text.Font
    // Color is the text color.
    Color color.RGBA
    // Alignment specify the text alignment.
    Alignment text.Alignment
    // MaxLines limits the number of lines. Zero means no limit.
    MaxLines int
    Text     string
    // contains filtered or unexported fields
}

func (Label) Layout Uses

func (l Label) Layout(gtx *layout.Context)

type RadioButton Uses

type RadioButton struct {
    Key string
    // contains filtered or unexported fields
}

func (RadioButton) Layout Uses

func (r RadioButton) Layout(gtx *layout.Context, enum *widget.Enum)

type Theme Uses

type Theme struct {
    Shaper *text.Shaper
    Color  struct {
        Primary color.RGBA
        Text    color.RGBA
        Hint    color.RGBA
        InvText color.RGBA
    }
    TextSize unit.Value
    // contains filtered or unexported fields
}

func NewTheme Uses

func NewTheme() *Theme

func (*Theme) Body1 Uses

func (t *Theme) Body1(txt string) Label

func (*Theme) Body2 Uses

func (t *Theme) Body2(txt string) Label

func (*Theme) Button Uses

func (t *Theme) Button(txt string) Button

func (*Theme) Caption Uses

func (t *Theme) Caption(txt string) Label

func (*Theme) CheckBox Uses

func (t *Theme) CheckBox(label string) CheckBox

func (*Theme) Editor Uses

func (t *Theme) Editor(hint string) Editor

func (*Theme) H1 Uses

func (t *Theme) H1(txt string) Label

func (*Theme) H2 Uses

func (t *Theme) H2(txt string) Label

func (*Theme) H3 Uses

func (t *Theme) H3(txt string) Label

func (*Theme) H4 Uses

func (t *Theme) H4(txt string) Label

func (*Theme) H5 Uses

func (t *Theme) H5(txt string) Label

func (*Theme) H6 Uses

func (t *Theme) H6(txt string) Label

func (*Theme) IconButton Uses

func (t *Theme) IconButton(icon *Icon) IconButton

func (*Theme) Image Uses

func (t *Theme) Image(img paint.ImageOp) Image

func (*Theme) Label Uses

func (t *Theme) Label(size unit.Value, txt string) Label

func (*Theme) RadioButton Uses

func (t *Theme) RadioButton(key, label string) RadioButton

RadioButton returns a RadioButton with a label. The key specifies the value for the Enum.

Package material imports 15 packages (graph) and is imported by 3 packages. Updated 2019-11-13. Refresh now. Tools for package owners.