golang开发GUI桌⾯应⽤fyne（三）
⽂档
画布 Canvas
在 Fyne 中，我们向窗体设置内容的⽅法 window.SetContent(CanvasObject)，它的参数是fyne.CanvasObject。
所以显⽰的元素都是 fyne.CanvasObject 对象，也可以说，他们都是绘制在画布Canvas上的。
// CanvasObject describes any graphical object that can be added to a canvas.
// Objects have a size and position that can be controlled through this API.
// MinSize is used to determine the minimum size which this object should be displayed.
// An object will be visible by default but can be hidden with Hide() and re-shown with Show().
//
// Note: If this object is controlled as part of a Layout you should not call
// Resize(Size) or Move(Position).
type CanvasObject interface{
// geometry
// MinSize returns the minimum size this object needs to be drawn.
MinSize() Size
// Move moves this object to the given position relative to its parent.
// This should only be called if your object is not in a container with a layout manager.
Move(Position)
// Position returns the current position of the object relative to its parent.
Position() Position
// Resize resizes this object to the given size.
/
/ This should only be called if your object is not in a container with a layout manager.
Resize(Size)
// Size returns the current size of this object.
Size() Size
// visibility
// Hide hides this object.
Hide()
// Visible returns whether this object is visible or not.
Visible()bool
// Show shows this object.
Show()
/
/ Refresh must be called if this object should be redrawn because its inner state changed.
Refresh()
}
如果fyne.CanvasObject是处在有layout的container中，那么就不能调⽤Resize⽅法和Move⽅法，因为此时他们已经被布局接管了。但是，的确需要设置 Resize 的话，可以先使⽤ layout.NewGridWrapLayout 设置好⼤⼩，外⾯再套⼀层你想要的 layout ，⽐如我想将⼀个图⽚设置⼤⼩并居中：
img := canvas.NewImageFromResource(resourceClockJpg)
img.FillMode = canvas.ImageFillOriginal
content1 := container.New(layout.NewCenterLayout(), container.New(layout.NewGridWrapLayout(fyne.NewSize(100,100)), img))
Canvas 提供了⼀些基础的绘制元素。
图像 image
长⽅形 rectangle
线 line
圆 circle
⽂本 text
渐变⾊效果，包括放射渐变 canvas.RadialGradient，线性渐变 canvas.LinearGradient。
rectangle
使⽤最简单，通过 canvas.NewRectangle() 创建。
可以设置宽⾼，填充⾊，边框线的宽和颜⾊。
关于颜⾊，透明度Alpha为0是全透明，255为没有透明度。
green := color.NRGBA{R:0, G:180, B:0, A:255}
修改了rectangle的属性之后需要调⽤ Refresh 来重新渲染，其他元素也是⼀样的。
Text
简单⽂本对象，通过 canvas.NewText() 创建。
// Text describes a text primitive in a Fyne canvas.
// A text object can have a style set which will apply to the whole string.
// No formatting or text parsing will be performed
type Text struct{
baseObject
Alignment fyne.TextAlign // The alignment of the text content
Color    color.Color    // The main text draw color
Text      string// The string content of this Text
TextSize  float32// Size of the text - if the Canvas scale is 1.0 this will be equivalent to point size
TextStyle fyne.TextStyle // The style of the text content
}
该对象可以设置对齐，颜⾊，⽂本内容，字号⼤⼩，样式。
对齐有三个常量：左对齐 TextAlignLeading，居中 TextAlignCenter， 右对齐 TextAlignTrailing。// TextStyle represents the styles that can be applied to a text canvas object
// or text based widget.
type TextStyle struct{
Bold      bool// Should text be bold
Italic    bool// Should text be italic
Monospace bool// Use the system monospace font instead of regular
// Since: 2.1
TabWidth int// Width of tabs in spaces
}
TextStyle 可以设置粗体，倾斜，字间距，tab键的宽度（占⼏个空格）。
最后就是字体的设置，全局同意字体，通过环境变量的 FYNE_FONT 设置⼀个 ttf 或者 ttc 的字体，前⾯的⽂章已经讲过了。
line
通过 canvas.NewLine() 创建直线。可以设置线宽，颜⾊，起始点（默认左上⾓），终点坐标（默认右下⾓）。
// Line describes a colored line primitive in a Fyne canvas.
// Lines are special as they can have a negative width or height to indicate
// an inverse slope (i.e. slope up vs down).
type Line struct{
Position1 fyne.Position // The current top-left position of the Line
Position2 fyne.Position // The current bottomright position of the Line
Hidden    bool// Is this Line currently hidden
StrokeColor color.Color // The line stroke color
StrokeWidth float32// The stroke width of the line
}
type Position struct{
X float32// The position from the parent's left edge
Y float32// The position from the parent's top edge
}
circle
通过 canvas.NewCircle() 创建。可以设置填充⾊，边框线宽和颜⾊。另外它居然是通过左上⾓坐标和右下⾓坐标来确定圆位置和⼤⼩的，⽽不是通过圆⼼坐标和半径，有点奇怪。
// Circle describes a colored circle primitive in a Fyne canvas
type Circle struct{
Position1 fyne.Position // The current top-left position of the Circle
Position2 fyne.Position // The current bottomright position of the Circle
Hidden    bool// Is this circle currently hidden
FillColor  color.Color // The circle fill color
StrokeColor color.Color // The circle stroke color
StrokeWidth float32// The stroke width of the circle
}
image
// NewImageFromFile creates a new image from a local file.
// Images returned from this method will scale to fit the canvas object.
// The method for scaling can be set using the Fill field.
func NewImageFromFile(file string)*Image
// NewImageFromURI creates a new image from named resource.
// File URIs will read the file path and other schemes will download the data into a resource.
// HTTP and HTTPs URIs will use the GET method by default to request the resource.
// Images returned from this method will scale to fit the canvas object.
// The method for scaling can be set using the Fill field.
/
/
// Since: 2.0
func NewImageFromURI(uri fyne.URI)*Image
// NewImageFromReader creates a new image from a data stream.
// The name parameter is required to uniquely identify this image (for caching etc).
// If the image in this io.Reader is an SVG, the name should end ".svg".
// Images returned from this method will scale to fit the canvas object.
// The method for scaling can be set using the Fill field.
//
// Since: 2.0
func NewImageFromReader(read io.Reader, name string)*Image
/
/ NewImageFromResource creates a new image by loading the specified resource.
// Images returned from this method will scale to fit the canvas object.
// The method for scaling can be set using the Fill field.
func NewImageFromResource(res fyne.Resource)*Image
// NewImageFromImage returns a new Image instance that is rendered from the Go
textstyle
// image.Image passed in.
// Images returned from this method will scale to fit the canvas object.
// The method for scaling can be set using the Fill field.
func NewImageFromImage(img image.Image)*Image
// Image describes a drawable image area that can render in a Fyne canvas
// The image may be a vector or a bitmap representation and it will fill the area.
/
/ The fill mode can be changed by setting FillMode to a different ImageFill.
type Image struct{
baseObject
// one of the following sources will provide our image data
File    string// Load the image from a file
Resource fyne.Resource // Load the image from an in-memory resource
Image    image.Image  // Specify a loaded image to use in this canvas object
Translucency float64// Set a translucency value > 0.0 to fade the image
FillMode    ImageFill  // Specify how the image should expand to fill or fit the available space
ScaleMode    ImageScale // Specify the type of scaling interpolation applied to the image
}
关于 FillMode 有三种，⼀定要设置，否则图⽚的默认⼤⼩为(1, 2)，也就是看不见了。
ImageFillStretch 拉伸，填满空间。
ImageFillContain 保持宽⾼⽐。
ImageFillOriginal 保持原始⼤⼩，不缩放。
这⾥的 image.Image 是标准库的包，⽐如使⽤像素点来创建⼀个图像
myApp := app.New()
myWindow := myApp.NewWindow("xxx")
images := image.NewRGBA(image.Rectangle{Min: image.Point{}, Max: image.Point{X:100, Y:100}})
for i :=0; i <100; i++{
for j :=0; j <100; j++{
images.Set(i, j, color.NRGBA{R:uint8(i %256), G:uint8(j %256), A:255})
}
}
img2 := canvas.NewImageFromImage(images)
img2.FillMode = canvas.ImageFillOriginal
myWindow.SetContent(img2)
myWindow.ShowAndRun()
gradient
梯度渐变效果，有两种类型canvas.LinearGradient（线性渐变）和canvas.RadialGradient（放射渐变），指从⼀种颜⾊渐变到另⼀种颜⾊。线性渐变⼜分为⽔平线性渐变和垂直线性渐变，分别通过canvas.NewHorizontalGradient()和canvas.NewVerticalGradient()创建。放射渐变通
过canvas.NewRadialGradient()创建。
a := app.New()
w := a.NewWindow("Canvas")
gradient1 := canvas.NewRadialGradient(color.Black, color.Transparent)
gradient2 := canvas.NewHorizontalGradient(color.Black, color.Transparent)
gradient3 := canvas.NewVerticalGradient(color.Black, color.Transparent)
w.SetContent(container.New(layout.NewGridWrapLayout(fyne.NewSize(100,100)), gradient1, gradient2, gradient3))
w.Resize(fyne.NewSize(600,200))
w.ShowAndRun()
控件 Widget
控件就是对上⾯提到的 canvas 基本元素的封装，进⼀步⽅便我们调⽤。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。