WYSIWYG theme editor for Fyne

GitHub release (latest SemVer) Go Report Card GitHub

fyne-theme-generator

WYSIWYG theme editor for Fyne

Installation

go get github.com/lusingander/fyne-theme-generator

Usage

You can change each parameter that can be set as Fyne theme.

Default themes

You can choose a new theme from Fine v1.4 or later, or an earlier theme and apply and customize it.

Fonts

You can also change the font, and export font bundled file.

Export

You can export the theme file as theme_gen.go you set.

If the Generate font file is checked, the font file is also exported as font_gen.go (It will not be exported if you have not changed any of the fonts).

The following is an example of the output theme_gen.go.

package main

import (
	"image/color"

	"fyne.io/fyne/v2"
	"fyne.io/fyne/v2/theme"
)

type myTheme struct{}

func (myTheme) Color(c fyne.ThemeColorName, v fyne.ThemeVariant) color.Color {
	switch c {
	case theme.ColorNameBackground:
		return color.NRGBA{R: 0x30, G: 0x30, B: 0x30, A: 0xff}
	case theme.ColorNameButton:
		return color.Alpha16{A: 0x0}
	case theme.ColorNameDisabledButton:
		return color.NRGBA{R: 0x26, G: 0x26, B: 0x26, A: 0xff}
	case theme.ColorNameDisabled:
		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x42}
	case theme.ColorNameError:
		return color.NRGBA{R: 0xf4, G: 0x43, B: 0x36, A: 0xff}
	case theme.ColorNameFocus:
		return color.NRGBA{R: 0x21, G: 0x96, B: 0xf3, A: 0x7f}
	case theme.ColorNameForeground:
		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0xff}
	case theme.ColorNameHover:
		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0xf}
	case theme.ColorNameInputBackground:
		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x19}
	case theme.ColorNamePlaceHolder:
		return color.NRGBA{R: 0xb2, G: 0xb2, B: 0xb2, A: 0xff}
	case theme.ColorNamePressed:
		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x66}
	case theme.ColorNamePrimary:
		return color.NRGBA{R: 0x21, G: 0x96, B: 0xf3, A: 0xff}
	case theme.ColorNameScrollBar:
		return color.NRGBA{R: 0x0, G: 0x0, B: 0x0, A: 0x99}
	case theme.ColorNameShadow:
		return color.NRGBA{R: 0x0, G: 0x0, B: 0x0, A: 0x66}
	default:
		return theme.DefaultTheme().Color(c, v)
	}
}

func (myTheme) Font(s fyne.TextStyle) fyne.Resource {
	if s.Monospace {
		return theme.DefaultTheme().Font(s)
	}
	if s.Bold {
		if s.Italic {
			return theme.DefaultTheme().Font(s)
		}
		return theme.DefaultTheme().Font(s)
	}
	if s.Italic {
		return theme.DefaultTheme().Font(s)
	}
	return theme.DefaultTheme().Font(s)
}

func (myTheme) Icon(n fyne.ThemeIconName) fyne.Resource {
	return theme.DefaultTheme().Icon(n)
}

func (myTheme) Size(s fyne.ThemeSizeName) float32 {
	switch s {
	case theme.SizeNameCaptionText:
		return 11
	case theme.SizeNameInlineIcon:
		return 20
	case theme.SizeNamePadding:
		return 4
	case theme.SizeNameScrollBar:
		return 16
	case theme.SizeNameScrollBarSmall:
		return 3
	case theme.SizeNameSeparatorThickness:
		return 1
	case theme.SizeNameText:
		return 14
	case theme.SizeNameInputBorder:
		return 2
	default:
		return theme.DefaultTheme().Size(s)
	}
}

Related projects

Similar Resources

Calculator-with-Fyne - A Fyne calculator with a GUI

Calculator-with-Fyne - A Fyne calculator with a GUI

Calculator Basic calculator for learning Fyne and honing Go skills. Installation

Apr 26, 2022

Termux theme manager written in go

Termux theme manager written in go

Dec 10, 2022

Grpcui-redoc - Redoc Theme for gRPC UI

Grpcui-redoc - Redoc Theme for gRPC UI

Redoc Theme for gRPC UI Redoc Theme for gRPC UI Don't gRPC without it! Prerequis

Nov 2, 2022

Mini is a small text editor, inspred by antirez's kilo editor.

Mini is a small text editor, inspred by antirez's kilo editor.

mini Mini is a small text editor, inspred by antirez's kilo editor. It aims to Keep it simple, stupid.

Dec 23, 2022

NERV Editor - A simple but peculiar text editor

NERV Editor - A simple but peculiar text editor

nerved a simple but peculiar text editor introduction nerved is a text editor bu

Oct 24, 2022

A full desktop environment for Linux/Unix using Fyne

A full desktop environment for Linux/Unix using Fyne

About FyneDesk is an easy to use Linux/Unix desktop environment following material design. It is build using the Fyne toolkit and is designed to be ea

Dec 31, 2022

A chess GUI build using the Fyne toolkit.

A chess GUI build using the Fyne toolkit.

Chess The subject of my current live stream series. A simple chess UI built with Fyne. Thanks to: Chess Go library by Logan Spears github.com/notnil/c

Dec 20, 2022

The Fyne IDE

DEFyne This repo contains the work-in-progress Fyne IDE. Features Embedded terminal TODO Various types of editor Syntax highlighting Standard run/test

Dec 20, 2022

A Fyne login manager for linux desktop computers

A Fyne login manager for linux desktop computers

Fin, the Fyne Login Manager This app is in it's very early stages and has only been tested with pam and systemd to log in users with a .xinitrc file.

Oct 12, 2022

Cross-platform, multi-server chat app built using Fyne

Cross-platform, multi-server chat app built using Fyne

Fibro Really early days proof of concept for a cross-platform multi-server chat. Feel free to play, but don't expect it to do much! Features Multiple

Sep 10, 2022

This is a Virtual Operating System made by using GOLANG and FYNE.

This is a Virtual Operating System made by using GOLANG and FYNE.

Virtual-Operating-System This is a Virtual Operating System made by using GOLANG and FYNE. Hello! All In this project I have made a virtual Operating

Nov 1, 2021

A fork of fin, but using wail instead of fyne.

A fork of fin, but using wail instead of fyne.

Fin, the Fyne Login Manager A minimal but good-looking login manager for Linux/Unix. The current boot scripts support only systemd. If you'd like to t

Nov 16, 2022

Virtual-Operating-System - Virtual Operating System Using Golang And Fyne Implemented Gallery app

Virtual-Operating-System - Virtual Operating System Using Golang And Fyne Implemented Gallery app

Virtual Operating System Virtual Operating System Using Golang And Fyne Implemen

Jan 1, 2022

OperatingSys-GO - A Virtual Operating System made by using GOLANG and FYNE

Operating-System This is a Virtual Operating System made by using GOLANG and FYN

Jan 2, 2022

Highly extensible, customizable application launcher and window switcher written in less than 300 lines of Golang and fyne

Highly extensible, customizable application launcher and window switcher written in less than 300 lines of Golang and fyne

golauncher A go application launcher A simple, highly extensible, customizable application launcher and window switcher written in less than 300 lines

Aug 21, 2022

Hybro - App To Play Around With Fyne; To Remind Myself To Drink Water

Hybro Drink Up Homie! App To Remind Myself To Drink Water. Probably also will ke

Jul 24, 2022

Pure Go line editor with history, inspired by linenoise

Liner Liner is a command line editor with history. It was inspired by linenoise; everything Unix-like is a VT100 (or is trying very hard to be). If yo

Jan 3, 2023

A graphical text editor

A graphical text editor

A A is a text editor inspired by the Sam and Acme text editors for the Plan 9 operating system. binary Latest Binaries https://github.com/as/a/release

Dec 13, 2022

A Programmer's Text Editor

A Programmer's Text Editor

The de Editor de is a programmer's editor. (Where that programmer happens to be driusan.) It's kind of like a bastard child of vim and Plan 9's acme e

Dec 8, 2022
Comments
  • Generated font file still references Fyne v1 in the imports

    Generated font file still references Fyne v1 in the imports

    The generated font file still references Fyne v1. I don't know if this is intentional so I just want to share my finding with you.

    In line 5 of font_gen.go:

    import "fyne.io/fyne"
    
  • Font selection for Bold and BoldItalic is mixed up

    Font selection for Bold and BoldItalic is mixed up

    I like the app so far and it is a lot easier to make your own theme with it, so thanks a lot for making it!

    I just discovered that the font selection for bold and bold italic is mixed up. You can also see it in the card widget titles. They are all italic. If you switch out the fonts manually and put a bold italic font in the selection for a bold font and the other way around it works properly.

    Bildschirmfoto 2021-03-05 um 10 30 29

    Vs how the app starts: Bildschirmfoto 2021-03-05 um 10 33 19

    Edit: But in the theme file it is correct. So I exported my theme file as shown in image 1 but the bold and bold italic fonts are mixed up. So the bug only seems to be in the ui.

  • Generated theme causing white boxes

    Generated theme causing white boxes

    Managed to somehow generate a theme that breaks the software it's used in and causes random white dialogues and boxes in a fyne app on random pc's

    // Code generated by fyne-theme-generator
    
    package gui
    
    import (
    	"image/color"
    
    	"fyne.io/fyne/v2"
    	"fyne.io/fyne/v2/theme"
    )
    
    type Theme struct{}
    
    func (Theme) Color(c fyne.ThemeColorName, v fyne.ThemeVariant) color.Color {
    	switch c {
    	case theme.ColorNameBackground:
    		return color.NRGBA{R: 0x30, G: 0x30, B: 0x30, A: 0xff}
    	case theme.ColorNameButton:
    		return color.Alpha16{A: 0x0}
    	case theme.ColorNameDisabledButton:
    		return color.NRGBA{R: 0x26, G: 0x26, B: 0x26, A: 0xff}
    	case theme.ColorNameDisabled:
    		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x42}
    	case theme.ColorNameError:
    		return color.NRGBA{R: 0xf4, G: 0x43, B: 0x36, A: 0xff}
    	case theme.ColorNameFocus:
    		return color.NRGBA{R: 0x21, G: 0x96, B: 0xf3, A: 0x7f}
    	case theme.ColorNameForeground:
    		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0xff}
    	case theme.ColorNameHover:
    		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0xf}
    	case theme.ColorNameInputBackground:
    		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x19}
    	case theme.ColorNamePlaceHolder:
    		return color.NRGBA{R: 0xb2, G: 0xb2, B: 0xb2, A: 0xff}
    	case theme.ColorNamePressed:
    		return color.NRGBA{R: 0xff, G: 0xff, B: 0xff, A: 0x66}
    	case theme.ColorNamePrimary:
    		return color.NRGBA{R: 0x21, G: 0x96, B: 0xf3, A: 0xff}
    	case theme.ColorNameScrollBar:
    		return color.NRGBA{R: 0x0, G: 0x0, B: 0x0, A: 0x99}
    	case theme.ColorNameShadow:
    		return color.NRGBA{R: 0x0, G: 0x0, B: 0x0, A: 0x66}
    	case theme.ColorNameSuccess:
    		return color.NRGBA{R: 0x0, G: 0xf0, B: 0x0, A: 0x66}
    	default:
    		return theme.DefaultTheme().Color(c, v)
    	}
    }
    
    func (Theme) Font(s fyne.TextStyle) fyne.Resource {
    	if s.Monospace {
    		return theme.DefaultTheme().Font(s)
    	}
    	if s.Bold {
    		if s.Italic {
    			return theme.DefaultTheme().Font(s)
    		}
    		return theme.DefaultTheme().Font(s)
    	}
    	if s.Italic {
    		return theme.DefaultTheme().Font(s)
    	}
    	return theme.DefaultTheme().Font(s)
    }
    
    func (Theme) Icon(n fyne.ThemeIconName) fyne.Resource {
    	return theme.DefaultTheme().Icon(n)
    }
    
    func (Theme) Size(s fyne.ThemeSizeName) float32 {
    	switch s {
    	case theme.SizeNameCaptionText:
    		return 11
    	case theme.SizeNameInlineIcon:
    		return 20
    	case theme.SizeNamePadding:
    		return 2
    	case theme.SizeNameScrollBar:
    		return 16
    	case theme.SizeNameScrollBarSmall:
    		return 6
    	case theme.SizeNameSeparatorThickness:
    		return 0
    	case theme.SizeNameText:
    		return 14
    	case theme.SizeNameInputBorder:
    		return 2
    	case theme.SizeNameInnerPadding:
    		return 2
    	default:
    		return theme.DefaultTheme().Size(s)
    	}
    }
    

    https://github.com/fyne-io/fyne/issues/3423

    andydotxyz

    Then I'm guessing the PCs that it doesn't work on have a different theme variant default (light vs dark) compared to your working PC. Your custom theme is missing some colours that the toolkit is providing - my guess is that ColorNameOverlayBackground would be most likely.

Related tags
The Fyne IDE

DEFyne This repo contains the work-in-progress Fyne IDE. Features Embedded terminal TODO Various types of editor Syntax highlighting Standard run/test

Dec 20, 2022
A graphical text editor
A graphical text editor

A A is a text editor inspired by the Sam and Acme text editors for the Plan 9 operating system. binary Latest Binaries https://github.com/as/a/release

Dec 13, 2022
A Programmer's Text Editor
A Programmer's Text Editor

The de Editor de is a programmer's editor. (Where that programmer happens to be driusan.) It's kind of like a bastard child of vim and Plan 9's acme e

Dec 8, 2022
A very religious text editor

--== Godit - a very religious text editor ==-- Screenshots: * https://nosmileface.dev/images/godit-linux1.png * https://nosmileface.dev/images/god

Dec 27, 2022
A modern and intuitive terminal-based text editor
A modern and intuitive terminal-based text editor

micro is a terminal-based text editor that aims to be easy to use and intuitive, while also taking advantage of the capabilities of modern terminals.

Dec 30, 2022
Source code editor written in Go using go-gtk bindings. It aims to handle navigation effectively among large number of files.
Source code editor written in Go using go-gtk bindings. It aims to handle navigation effectively among large number of files.

tabby Source code editor written in Go using go-gtk bindings. It aims to handle navigation effectively among large number of files. screenshot: depend

Nov 16, 2022
An Enhanced Go Experience For The Atom Editor
An Enhanced Go Experience For The Atom Editor

go-plus An Improved Go Experience For The Atom Editor Github: https://github.com/joefitzgerald/go-plus Atom: https://atom.io/packages/go-plus Overview

Dec 26, 2022
Go version of Plan9 Acme Editor

Overview Go port of Rob Pike's Acme editor. Derived from ProjectSerenity but now increasingly divergent. ProjectSerenity was itself a transliteration

Dec 24, 2022
Binary editor written in Go
Binary editor written in Go

bed Binary editor written in Go Screenshot Why? Why not? Programming is so fun! I learned so much while creating this editor; handling of file pointer

Jan 5, 2023
MdEdit is a Vi-like markdown editor built using Gio

MdEdit MdEdit is a Vi-like markdown editor built using Gio. It is extremely early stage software. The Vi editor lacks most functionality and might be

Jun 29, 2022