注册 登录

清河洛

fyne中的常用组件

qingheluo2024-08-14清河洛409
fyne中的组件是在主包中定义的 type Widget interface { CanvasObject CreateRenderer() WidgetRenderer } 有些有交互性的画布还有启用和禁用的方法 Disable() Disabled() bool Enable() 组件是一种关联了不同交互行为的特殊画布对象WidgetRenderer表示组件实现的特定行为,一般我们不需要进行修改在"fyne/widget"包中实现了很多种在软件开发过程中会用到的各种组件分隔符(Separator)使用主题颜色的分隔符 type Separator struct {}...

fyne中的组件是在主包中定义的

type Widget interface {
    CanvasObject
    CreateRenderer() WidgetRenderer
}

有些有交互性的画布还有启用和禁用的方法

Disable()
Disabled() bool

Enable()

组件是一种关联了不同交互行为的特殊画布对象

WidgetRenderer表示组件实现的特定行为,一般我们不需要进行修改

在"fyne/widget"包中实现了很多种在软件开发过程中会用到的各种组件

分隔符(Separator)

使用主题颜色的分隔符

type Separator struct {}
NewSeparator() *Separator

 折叠列表(Accordion)

显示一个表,每个列表项都有一个按钮,点击会显示详细内容

type Accordion struct {
    Items     []*AccordionItem
    MultiOpen bool
}
NewAccordion(items ...*AccordionItem) *Accordion

type AccordionItem struct {
    Title  string
    Detail fyne.CanvasObject
    Open   bool
}
NewAccordionItem(title string, detail fyne.CanvasObject) *AccordionItem

Append(item *AccordionItem)
Close(index int)
CloseAll()
Open(index int)
OpenAll() {
Remove(item *AccordionItem)
RemoveIndex(index int)

 按钮(Button)

具有文本标签和图标,两者都是可选的

type Button struct {
    Text string
    Icon fyne.Resource
    Importance    int  // 突出显示级别,0-5
    Alignment     int  // 0居中,1开始,2结束
    IconPlacement int  // 0开始,1结束
    OnTapped func()
}
NewButton(label string, tapped func()) *Button
NewButtonWithIcon(label string, icon fyne.Resource, tapped func()) *Button

SetIcon(icon fyne.Resource)
SetText(text string)

卡片(Card)

使用标题和子标题对元素进行分组

type Card struct {
    Title, Subtitle string
    Image           *canvas.Image
    Content         fyne.CanvasObject
}
NewCard(title, subtitle string, content fyne.CanvasObject) *Card

SetContent(obj fyne.CanvasObject)
SetImage(img *canvas.Image)
SetSubTitle(text string)
SetTitle(text string)

复选框(Check)

一个文本标签和一个可以选中的图标

type Check struct {
    Text    string
    Checked bool
    OnChanged func(bool)
}
NewCheck(label string, changed func(bool)) *Check
NewCheckWithData(label string, data binding.Bool) *Check

Bind(data binding.Bool)
Unbind()
SetChecked(checked bool)
SetText(text string)

复选框组(CheckGroup)

表示由若干复选框组成的一组复选框

type CheckGroup struct {
    Horizontal bool  // 水平排列
    Required   bool
    OnChanged  func([]string)
    Options    []string
    Selected   []string
    items      []*Check
}
NewCheckGroup(options []string, changed func([]string)) *CheckGroup

Append(option string)
Remove(option string)
SetSelected(options []string)

单选按钮(RadioGroup)

type RadioGroup struct {
    Horizontal bool    // 水平排列
    Required   bool
    OnChanged  func(string)
    Options    []string
    Selected   string
}
NewRadioGroup(options []string, changed func(string)) *RadioGroup

Append(option string)
SetSelected(option string)

下拉选择(Select)

type Select struct {
    Alignment   fyne.TextAlign
    Selected    string
    Options     []string
    PlaceHolder string  // 提示文本,默认"(Select one)"
    OnChanged   func(string)
}
NewSelect(options []string, changed func(string)) *Select

SetOptions(options []string)
SetSelected(text string)
SetSelectedIndex(index int)
ClearSelected()
SelectedIndex() int

可输入下拉选择(SelectEntry)

type SelectEntry struct {
    Entry
}
NewSelectEntry(options []string) *SelectEntry

SetOptions(options []string)

输入框(Entry)

type Entry struct {
    Text     string
    TextStyle   fyne.TextStyle
    PlaceHolder string   // 占位字符
    OnChanged   func(string)
    OnSubmitted func(string)
    Password    bool
    MultiLine   bool     // 多行
    Wrapping    fyne.TextWrap  // 换行
    Scroll widget.ScrollDirection  // 滚动条
        widget.ScrollDirection为一个int
        0表示可滚动自身及子元素内容
        1表示支持水平和垂直滚动
        2仅水平滚动
        3仅垂直滚动
        4禁止滚动
    Validator           fyne.StringValidator
        // 验证输入内容
        // 当验证函数返回nil时会在输入框最后显示对号
        // type StringValidator func(string) error

    CursorRow, CursorColumn int
    OnCursorChanged         func()
        // 当前光标所在行列
}
NewEntry() *Entry
NewMultiLineEntry() *Entry
NewPasswordEntry() *Entry
NewEntryWithData(data binding.String) *Entry

Bind(data binding.String)
Unbind()
SelectedText() string
SetMinRowsVisible(count int)  // 最小行数
SetPlaceHolder(text string)
SetText(text string)
Append(text string)

文件图标(FileIcon)

为各类型的文件提供有用的标准图标

type FileIcon struct {
    URI      fyne.URI
    resource  fyne.Resource
    extension string
}
NewFileIcon(uri fyne.URI) *FileIcon

SetURI(uri fyne.URI)

表单(Form)

表单组件是两列网格,其中每一行都有一个标签和一个小部件(通常是一个输入),最后一行包含按钮

type Form struct {
    Items      []*FormItem
    OnSubmit   func()
    OnCancel   func()
    SubmitText string
    CancelText string
    Orientation Orientation    // 0默认水平,1垂直,2自动

}
NewForm(items ...*FormItem) *Form

Append(text string, widget fyne.CanvasObject)
AppendItem(item *FormItem)

type FormItem struct {
    Text   string
    Widget fyne.CanvasObject
    HintText string  // 提示字符串
}
NewFormItem(text string, widget fyne.CanvasObject) *FormItem

超链接(Hyperlink)

具有适当填充和布局的文本组件,单击后在默认浏览器中打开

type Hyperlink struct {
    Text      string
    URL       *url.URL
    Alignment fyne.TextAlign
    Wrapping  fyne.TextWrap
    TextStyle fyne.TextStyle
    Truncation fyne.TextTruncation  // 文本截断
    SizeName fyne.ThemeSizeName
    OnTapped func()
}
NewHyperlink(text string, url *url.URL) *Hyperlink
NewHyperlinkWithStyle(text string, url *url.URL, alignment fyne.TextAlign, style fyne.TextStyle) *Hyperlink

SetText(text string)
SetURL(url *url.URL)
SetURLFromString(str string) error

图标(Icon)

type Icon struct {
    Resource  fyne.Resource
    cachedRes fyne.Resource
}
NewIcon(res fyne.Resource) *Icon

SetResource(res fyne.Resource)

文本标签(Label)

type Label struct {
    Text      string
    Alignment fyne.TextAlign
    Wrapping  fyne.TextWrap
    TextStyle fyne.TextStyle
    Truncation fyne.TextTruncation
    Importance Importance  // 突出显示级别,0-5
}
NewLabel(text string) *Label
NewLabelWithStyle(text string, alignment fyne.TextAlign, style fyne.TextStyle) *Label
NewLabelWithData(data binding.String) *Label

Bind(data binding.String)
Unbind()
SetText(text string)

滚动显示(Scroll)

滚动显示内容是一个比较特殊的组件,并未在"fyne/widget"包中进行实现,而是在"fyne/internal/widget"包中进行了实现

type Scroll struct {
    Direction ScrollDirection
    Content   fyne.CanvasObject
    Offset    fyne.Position
    OnScrolled func(fyne.Position) // 当滚动条滚动时的回调
}
NewScroll(content fyne.CanvasObject) *Scroll
NewHScroll(content fyne.CanvasObject) *Scroll
NewVScroll(content fyne.CanvasObject) *Scroll

ScrollToBottom()
ScrollToTop()
SetMinSize(size fyne.Size)

在"fyne/container"包中对"fyne/internal/widget"包进行了引用,两者完全相同,如

type Scroll = widget.Scroll
type ScrollDirection = widget.ScrollDirection

func NewScroll(content fyne.CanvasObject) *Scroll {
    return widget.NewScroll(content)
}
NewHScroll(content fyne.CanvasObject) *Scroll
NewVScroll(content fyne.CanvasObject) *Scroll
等等,完全相同

等宽文本(TextGrid)

将文本视为一个个的等高等宽网格

type TextGrid struct {
    Rows []TextGridRow
    ShowLineNumbers bool  // 显示行号
    ShowWhitespace  bool  // 显示空格
    TabWidth        int // If set to 0 the fyne.DefaultTabWidth is used
}
NewTextGrid() *TextGrid
NewTextGridFromString(content string) *TextGrid

SetText(text string)
Text() string
RowText(row int) string  // 指定行的字符串

富文本(RichText)

type RichText struct {
    Segments []RichTextSegment
    Wrapping fyne.TextWrap
    Scroll   widget.ScrollDirection
    Truncation fyne.TextTruncation
}
NewRichText(segments ...RichTextSegment) *RichText
NewRichTextWithText(text string) *RichText

String() string

RichTextSegment是一个用于显示富文本的接口

type RichTextSegment interface {
    Inline() bool
    Textual() string   // 文本字符串
    Update(fyne.CanvasObject)
    Visual() fyne.CanvasObject

    Select(pos1, pos2 fyne.Position)
    SelectedText() string
    Unselect()
}

TextSegment结构体实现了该接口

type TextSegment struct {
    Style RichTextStyle
    Text  string
}

其中RichTextStyle为富文本的样式,其定义为

type RichTextStyle struct {
    Alignment fyne.TextAlign
    ColorName fyne.ThemeColorName
    Inline    bool
    SizeName  fyne.ThemeSizeName
    TextStyle fyne.TextStyle
}

在widget包中,在文件"fyne\widget\richtext_objects.go"中定义了很多常用的富文本样式常量

RichTextStyleInline  :常规字体行
RichTextStyleParagraph:常规字体块

RichTextStyleCodeInline :等宽字体行
RichTextStyleCodeBlock  :等宽字体块

RichTextStyleEmphasis  :斜体行
RichTextStyleBlockquote:斜体块

在使用时,通过将TextSegment对象的指针传递给RichTextSegment

列表(list)

type List struct {
    Length       func() int
    CreateItem   func() fyne.CanvasObject
    UpdateItem   func(id ListItemID, item fyne.CanvasObject)
    OnSelected   func(id ListItemID)
    OnUnselected func(id ListItemID)
    HideSeparators bool  // 是否隐藏列表行之间的分隔符
}
NewList(length func() int, createItem func() fyne.CanvasObject, updateItem func(ListItemID, fyne.CanvasObject)) *List

SetItemHeight(id ListItemID, height float32)
Select(id ListItemID)
Unselect(id ListItemID)
UnselectAll()
ScrollTo(id ListItemID)  // 滚动到指定的项目位置
ScrollToBottom()         // 滚动到列表末尾
ScrollToTop()
ScrollToOffset(offset float32)  // 滚动到指定的偏移位置,小于0时按0计算
GetScrollOffset() float32  // 当前滚动偏移量

遮罩层(popup)

浮动在用户界面上方

type PopUp struct {
    Content fyne.CanvasObject
    Canvas  fyne.Canvas
    modal   bool // 隐藏属性,控制是否阻止下方画布的交互操作
}
NewPopUp(content fyne.CanvasObject, canvas fyne.Canvas) *PopUp
NewModalPopUp(content fyne.CanvasObject, canvas fyne.Canvas) *PopUp

ShowAtPosition(pos fyne.Position)

滑块(Slider)

type Slider struct {
    Value float64
    Min   float64
    Max   float64
    Step  float64
    Orientation Orientation  // 0,默认水平,1垂直,2自动
    OnChanged   func(float64)
    OnChangeEnded func(float64) // 拖动结束时
}
NewSlider(min, max float64) *Slider  // Step为1
NewSliderWithData(min, max float64, data binding.Float) *Slider

Bind(data binding.Float)
Unbind()
SetValue(value float64)

进度条(ProgressBar)

type ProgressBar struct {
    Min, Max, Value float64
    TextFormatter func() string
}
NewProgressBar() *ProgressBar
NewProgressBarWithData(data binding.Float) *ProgressBar

Bind(data binding.Float)
Unbind()
SetValue(v float64)

工具栏(Toolbar)

type Toolbar struct {
    Items []ToolbarItem
}
NewToolbar(items ...ToolbarItem) *Toolbar

Append(item ToolbarItem)
Prepend(item ToolbarItem)  // 放置在工具栏开头位置

type ToolbarItem interface {ToolbarObject() fyne.CanvasObject}
type ToolbarAction struct {
    Icon        fyne.Resource
    OnActivated func()
}
ToolbarAction实现了ToolbarItem
NewToolbarAction(icon fyne.Resource, onActivated func()) *ToolbarAction

SetIcon(icon fyne.Resource)

工具栏分隔符:NewToolbarSpacer()


网址导航