[GH-ISSUE #644] Invert text on InputField focus #469

Closed
opened 2026-03-04 01:05:16 +03:00 by kerem · 3 comments
Owner

Originally created by @rgrannell1 on GitHub (Sep 13, 2021).
Original GitHub issue: https://github.com/rivo/tview/issues/644

(may be related to #611)

Source Reference

Is it currently possible to invert an InputField's content on focus? My use-case is I'm using an InputField to input commands to execute, and I'd like to invert when focused and "normal" when focused on another item.

InputField does not support SetDynamicColors (which is fair from an API design standpoint), but supports several colour setters that accept tcell colours. Is it possible to invert colours (SGR 7) using InputField setters and tcell?

The closest "color" I can find is ColorReset

I don't want to hardcode colorBlack and colorWhite since this may clash with a user's terminal scheme; I want to respect what colours are already in place.

For example (using ANSI):

print "rl: some other text    line 1 / 20\n"; print "a"; print b; print c; print d; print e; print; print "\u001b[7m> Focused Input\u001b[0m"

Screenshot from 2021-09-13 18-44-12

print "rl: some other text    line 1 / 20\n"; print "a"; print b; print c; print d; print e; print; print "> Unfocused Input\u001b"

Screenshot from 2021-09-13 18-45-13

Originally created by @rgrannell1 on GitHub (Sep 13, 2021). Original GitHub issue: https://github.com/rivo/tview/issues/644 (may be related to #611) [Source Reference](https://github.com/rgrannell1/rl/blob/5c750556926650393e5b0499acc5eb0865077ef9/tui.go#L26) Is it currently possible to invert an `InputField`'s content on focus? My use-case is I'm using an `InputField` to input commands to execute, and I'd like to invert when focused and "normal" when focused on another item. `InputField` does not support `SetDynamicColors` (which is fair from an API design standpoint), but supports several colour setters that accept `tcell` colours. Is it possible to invert colours (SGR 7) using `InputField` setters and `tcell`? The closest "color" I can find is [ColorReset](https://github.com/gdamore/tcell/blob/f4d402906fa3d330545365abbf970c048e677b35/color.go#L837) I _don't_ want to hardcode `colorBlack` and `colorWhite` since this may clash with a user's terminal scheme; I want to respect what colours are already in place. For example (using ANSI): ```bash print "rl: some other text line 1 / 20\n"; print "a"; print b; print c; print d; print e; print; print "\u001b[7m> Focused Input\u001b[0m" ``` ![Screenshot from 2021-09-13 18-44-12](https://user-images.githubusercontent.com/835618/133131543-d62d7e21-c5ba-4b4d-9440-45201c7845cd.png) ```bash print "rl: some other text line 1 / 20\n"; print "a"; print b; print c; print d; print e; print; print "> Unfocused Input\u001b" ``` ![Screenshot from 2021-09-13 18-45-13](https://user-images.githubusercontent.com/835618/133131650-d2a5b842-f9f4-4d2d-bdeb-e1b5f9bfbda6.png)
kerem closed this issue 2026-03-04 01:05:16 +03:00
Author
Owner

@rgrannell1 commented on GitHub (Sep 13, 2021):

(Side-note, but thank you for your work ❤️; tview is amazing and I plan to use it heavily for all my go CLIs)

<!-- gh-comment-id:918443829 --> @rgrannell1 commented on GitHub (Sep 13, 2021): (Side-note, but thank you for your work :heart:; tview is amazing and I plan to use it heavily for all my go CLIs)
Author
Owner

@rivo commented on GitHub (Nov 9, 2021):

First of all, thanks for using tview and sorry for the late reply. There are multiple issues at play here. I realized that there was no way to listen for "focus" and "blur" events. So I added these to the Box primitive. This should allow you to change an input field's appearance when it's selected. See https://pkg.go.dev/github.com/rivo/tview#Box.SetFocusFunc and https://pkg.go.dev/github.com/rivo/tview#Box.SetBlurFunc (and the example below).

Secondly, not being able to use SGR 7 is indeed related to #611. For now, I've added tcell.Style getters and setters to InputField, which should allow you to use the Style.Reverse() attribute.

Lastly, using a terminal's default colours is tricky if not impossible. See https://github.com/gdamore/tcell/issues/292 for details. I don't know of any solution to this at the moment.

Here's an example that changes the input field's style when it has focus:

package main

import (
	"github.com/gdamore/tcell/v2"
	"github.com/rivo/tview"
)

func main() {
	app := tview.NewApplication()
	inputField := tview.NewInputField().
		SetLabel("Enter a number: ").
		SetFieldWidth(10).
		SetDoneFunc(func(key tcell.Key) {
			app.Stop()
		})
	inputField.SetBorder(true).
		SetFocusFunc(func() {
			inputField.SetFieldStyle(inputField.GetFieldStyle().Reverse(true))
		}).SetBlurFunc(func() {
			inputField.SetFieldStyle(inputField.GetFieldStyle().Reverse(false))
		})
	if err := app.SetRoot(tview.NewFlex().
		AddItem(inputField, 0, 1, true).
		AddItem(tview.NewBox().SetBorder(true), 0, 1, false), true).EnableMouse(true).Run(); err != nil {
		panic(err)
	}
}
<!-- gh-comment-id:964222241 --> @rivo commented on GitHub (Nov 9, 2021): First of all, thanks for using `tview` and sorry for the late reply. There are multiple issues at play here. I realized that there was no way to listen for "focus" and "blur" events. So I added these to the `Box` primitive. This should allow you to change an input field's appearance when it's selected. See https://pkg.go.dev/github.com/rivo/tview#Box.SetFocusFunc and https://pkg.go.dev/github.com/rivo/tview#Box.SetBlurFunc (and the example below). Secondly, not being able to use SGR 7 is indeed related to #611. For now, I've added `tcell.Style` getters and setters to `InputField`, which should allow you to use the [`Style.Reverse()`](https://pkg.go.dev/github.com/gdamore/tcell/v2#Style.Reverse) attribute. Lastly, using a terminal's default colours is tricky if not impossible. See https://github.com/gdamore/tcell/issues/292 for details. I don't know of any solution to this at the moment. Here's an example that changes the input field's style when it has focus: ```go package main import ( "github.com/gdamore/tcell/v2" "github.com/rivo/tview" ) func main() { app := tview.NewApplication() inputField := tview.NewInputField(). SetLabel("Enter a number: "). SetFieldWidth(10). SetDoneFunc(func(key tcell.Key) { app.Stop() }) inputField.SetBorder(true). SetFocusFunc(func() { inputField.SetFieldStyle(inputField.GetFieldStyle().Reverse(true)) }).SetBlurFunc(func() { inputField.SetFieldStyle(inputField.GetFieldStyle().Reverse(false)) }) if err := app.SetRoot(tview.NewFlex(). AddItem(inputField, 0, 1, true). AddItem(tview.NewBox().SetBorder(true), 0, 1, false), true).EnableMouse(true).Run(); err != nil { panic(err) } } ```
Author
Owner

@rgrannell1 commented on GitHub (Nov 9, 2021):

thanks for responding! These changes look excellent, I'll test them out this evening!

<!-- gh-comment-id:964253798 --> @rgrannell1 commented on GitHub (Nov 9, 2021): thanks for responding! These changes look excellent, I'll test them out this evening!
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/tview#469
No description provided.