Comments (4)
Here you go… This example shows both lists at once, does without any fancy colors and such, and can be quit via Esc or Ctrl-C. Items can be toggled via Space or Enter. As it is, it lacks a means of submitting the selection, does not validate your constraints (selecting two flavors), and can surely be improved/optimized, but you should get the idea.
package main
import (
"fmt"
tea "github.com/charmbracelet/bubbletea"
)
func main() {
m := &model{
flavors: []item{
{"orange", false},
{"strawberry", false},
{"watermelon", false},
{"apple", false},
},
adds: []item{
{"candies", false},
{"mixed colors", false},
{"strange glass shape", false},
},
}
if err := tea.NewProgram(m).Start(); err != nil {
panic(fmt.Sprintf("failed to run program: %v", err))
}
}
type model struct {
flavors, adds []item
list, item int
}
type item struct {
text string
checked bool
}
func (m *model) Init() tea.Cmd {
return nil
}
func (m *model) Update(msg tea.Msg) (tea.Model, tea.Cmd) {
switch typed := msg.(type) {
case tea.KeyMsg:
return m, m.handleKeyMsg(typed)
}
return m, nil
}
func (m *model) handleKeyMsg(msg tea.KeyMsg) tea.Cmd {
switch msg.String() {
case "esc", "ctrl+c":
return tea.Quit
case " ", "enter":
switch m.list {
case 0:
m.flavors[m.item].checked = !m.flavors[m.item].checked
case 1:
m.adds[m.item].checked = !m.adds[m.item].checked
}
case "up":
if m.item > 0 {
m.item--
} else if m.list > 0 {
m.list--
m.item = len(m.flavors) - 1
}
case "down":
switch m.list {
case 0:
if m.item+1 < len(m.flavors) {
m.item++
} else {
m.list++
m.item = 0
}
case 1:
if m.item+1 < len(m.adds) {
m.item++
}
}
}
return nil
}
func (m *model) View() string {
curFlavor, curAdd := -1, -1
switch m.list {
case 0:
curFlavor = m.item
case 1:
curAdd = m.item
}
return m.renderList("choose two flavors", m.flavors, curFlavor) +
"\n" +
m.renderList("select adds", m.adds, curAdd)
}
func (m *model) renderList(header string, items []item, selected int) string {
out := "~ " + header + ":\n"
for i, item := range items {
sel := " "
if i == selected {
sel = ">"
}
check := " "
if items[i].checked {
check = "✓"
}
out += fmt.Sprintf("%s [%s] %s\n", sel, check, item.text)
}
return out
}
from bubbletea.
I think you don't need multiple models, just have two separate structs/maps/slices/whatever for the respective selection state (checked items, current item) and a separate field that holds which of the two lists is active, both in the same model. From this, you can render the two lists consecutively (or, if that's what you're after, both at once with the current item moving between lists).
from bubbletea.
by chance do you get time to make a small example ? I tried that but it seems the view don't load and the keyboard movements get some issues as it go with two slices
from bubbletea.
thanks ! :)
from bubbletea.
Related Issues (20)
- First line not rendering until event happens HOT 3
- Part of the screen is not rendering when the view is exactly the size of the screen HOT 3
- `[ctrl+enter]` Support HOT 5
- text rendering incorrectly using serial data HOT 7
- Stopwatch example does not run correctly on Windows HOT 1
- How to use bubbletea and gum in existing cli which was built using cobra cli framework?
- kill the process but the mouse code still output in the console HOT 3
- A feature to avoid IDE extensions and build them in cli HOT 2
- Unmanaged Output Truncation (e.g. `tea.Println`) HOT 1
- Show example GIFs on all examples HOT 1
- The input isn't verified before using epoll on it HOT 3
- go version in go.mod is outdated HOT 2
- does Update() get called even when there are no keys being pressed?
- Can't write japanese characters in inputfield HOT 2
- Exit with error message to stderr and non-zero status code
- Async Clipboard
- Automatic command chaining: Cmd -> Cmd -> Msg HOT 1
- Allow WindowSizeMsg to be sent on sub-model Init HOT 5
- Progress bar behaving strangely
- Any support for charts?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bubbletea.