Fyne: Creating a NewButton with an image

[diamondburned]

I've seen NewButtonWithIcon take in a fyne.Resource, but how would I dynamically fetch an image and use that for the button? canvas.Image doesn't satisfy fyne.Resource interface.

[madzione]

This should do what you want:

iconFile, err := os.Open("C:/path/to/res/icon.png")
if err != nil {
    log.Fatal(err)
}

r := bufio.NewReader(iconFile)

b, err := ioutil.ReadAll(r)
if err != nil {
    log.Fatal(err)
}

btn := widget.NewButtonWithIcon("Browse", fyne.NewStaticResource("icon", b), func() {
    // do something
})

[diamondburned]

This would work with image.Image.Encode() as well, I'd assume? Thank you, I'll give it a shot.

[andydotxyz]

This is a good question. The reason that Resource is used is to push folk towards the icon resources which respond well to theme changes.

The above code would work if you want to load it from the filesystem.
to pass a canvas.Image or image.Image (via canvas.NewImageFromImage) you would need to encode it as you supposed.

It could be possible to have a button that displayed any image - but at that point we may lose the design principles as the content could be anything.

Is this because the icon you want is missing or are you doing something else?
Depending on your use-case a tappable image might be a better route?

[diamondburned]

I'm fetching online assets and put them into a button, like an anchor + img. Right now, a GET, a map (for caching) and NewStaticResource works.

This created a new side question for me, I can't seem to set the size of the icon (128x128) with button.Resize (the drawn size looks close to 16px). FYNE_SCALE=2 scales it, but `1`` is the same.

[andydotxyz]

The button size is being set by the layout. Fyne relies a lot on packing content to sensible sizes and so if you are using a standard layout then MinSize is more important than Resize.
The widget.Button is designed to provide a consistent button and part of it is setting a standard icon size.
A button will put a border around your image as well, to make it look like a button. Perhaps you want to create a custom widget that contains a canvas.Image instead, so you control the look of it?
We are looking at how to make it simpler to create custom widgets, but the process so far is documented at https://fyne.io/develop/custom-widget.html .

[diamondburned]

Having the Button example in the web page to use a baseWidget is very skeptical, I think. It should use either another widget that handles everything by itself, or baseWidget should be exported. (Not related to the issue, I am aware)

[andydotxyz]

Quite right - I put the doc there in a hurry. I can make a better example but there is a discussion document on our Wiki about exposing a widget.BaseWidget and so I have been waiting to see where that goes...

[diamondburned]

Heeding your advice, I've tried making one here: https://gitlab.com/diamondburned/fynecord/blob/master/widgets/guildbutton.go

It didn't quite yield what I wanted, however. There was no icon. I'll try and write a test suite and update.

[andydotxyz]

I think that in your Layout() function you should call gb.icon.Resize(size) - that's the only obvious thing missing.
If that doesn't help I will clone the code and try to see what's going on.

[andydotxyz]

I wanted to help with the code so I cloned the repository but I could not run it without a token.

Have you managed to try the Resize() call suggested above?

[andydotxyz]

Is there any update on this ticket? It would be great to close if you have got the code working.

[diamondburned]

Very sorry for not replying, I kinda got hung up on the projects. Me and my friend tested your suggestion and it seems like I also forgot to set gb.objects = []fyne.CanvasObject{gb.icon}, other than your suggestion on resizing. This is my fault. Also sorry for diverging the topic to something else.