Leak_Technologies/VideoTools
Leak_Technologies/VideoTools
2
1
Fork 1
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

Fri 02 Jan 2026 06:35:01 PM EST: Fix dropdown UI appearance to look like proper dropdowns

Browse Source 
🎨 Enhanced ColoredSelect Implementation:
• Replace button widget with native Select widget for authentic dropdown appearance
• Update renderer type from *widget.Button to *widget.Select for proper styling
• Maintain color-coded functionality with option-specific color mapping
• Auto-hide popup on selection to prevent UI conflicts
• Improve visual feedback with proper dropdown behavior

📊 UI/UX Improvements:
• Dropdowns now have proper select widget styling instead of button appearance
• Better visual distinction between clickable buttons and dropdown selects
• Maintained color-coding system for enhanced user experience
• Improved responsiveness and interaction patterns

🔧 Technical Changes:
• Updated coloredSelectRenderer struct to use widget.Select
• Modified CreateRenderer to use native Select with proper callback handling
• Ensured backward compatibility with existing SetSelected and UpdateOptions methods
• Preserved all color mapping and placeholder functionality
This commit is contained in:
Stu Leak 2026-01-02 18:35:01 -05:00
parent 8eaa2022cf
commit c6f82f274a
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
internal/ui/components.go
View File

@ -1113,15 +1113,31 @@ func (cs *ColoredSelect) Disable() {
// CreateRenderer creates the renderer for the colored select // CreateRenderer creates the renderer for the colored select
func (cs *ColoredSelect) CreateRenderer() fyne.WidgetRenderer { func (cs *ColoredSelect) CreateRenderer() fyne.WidgetRenderer {
// Create the button that shows current selection // Create styled dropdown using native Select widget for better appearance
displayText := cs.selected displayText := cs.selected
if displayText == "" && cs.placeHolder != "" { if displayText == "" && cs.placeHolder != "" {
displayText = cs.placeHolder displayText = cs.placeHolder
} }
button := widget.NewButton(displayText, func() { // Create native Select widget that supports proper dropdown appearance
cs.showPopup() button := widget.NewSelect(cs.options, func(value string) {
cs.selected = value
if cs.onChanged != nil {
cs.onChanged(value)
}
// Auto-hide popup when selection is made
if cs.popup != nil {
cs.popup.Hide()
cs.popup = nil
}
cs.Refresh()
}) })
button.SetSelected(displayText)
// Style to enhance dropdown appearance
if theme := fyne.CurrentApp().Settings().Theme(); theme != nil {
button.Refresh()
}
return &coloredSelectRenderer{ return &coloredSelectRenderer{
select_: cs, select_: cs,
@ -1205,7 +1221,7 @@ func (cs *ColoredSelect) Tapped(*fyne.PointEvent) {
type coloredSelectRenderer struct { type coloredSelectRenderer struct {
select_ *ColoredSelect select_ *ColoredSelect
button *widget.Button button *widget.Select
} }
func (r *coloredSelectRenderer) Layout(size fyne.Size) { func (r *coloredSelectRenderer) Layout(size fyne.Size) {
@ -1221,7 +1237,7 @@ func (r *coloredSelectRenderer) Refresh() {
if displayText == "" && r.select_.placeHolder != "" { if displayText == "" && r.select_.placeHolder != "" {
displayText = r.select_.placeHolder displayText = r.select_.placeHolder
} }
r.button.SetText(displayText) r.button.SetSelected(displayText)
r.button.Refresh() r.button.Refresh()
} }