dropdown.go 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. // Copyright 2016 The G3N Authors. All rights reserved.
  2. // Use of this source code is governed by a BSD-style
  3. // license that can be found in the LICENSE file.
  4. package gui
  5. import (
  6. "github.com/g3n/engine/gui/assets"
  7. "github.com/g3n/engine/math32"
  8. "github.com/g3n/engine/window"
  9. )
  10. type DropDown struct {
  11. Panel // Embedded panel
  12. icon *Label // internal label with icon
  13. list *List // internal list
  14. styles *DropDownStyles // pointer to dropdown styles
  15. litem *ImageLabel // Item shown in drop box (copy of selected)
  16. selItem *ImageLabel // selected item from list
  17. overDropdown bool
  18. overList bool
  19. focus bool
  20. clickOut bool
  21. }
  22. // DropDown list style
  23. type DropDownStyle struct {
  24. Border BorderSizes
  25. Paddings BorderSizes
  26. BorderColor math32.Color4
  27. BgColor math32.Color
  28. FgColor math32.Color
  29. }
  30. // DropDown list styles
  31. type DropDownStyles struct {
  32. Normal *DropDownStyle
  33. Over *DropDownStyle
  34. Focus *DropDownStyle
  35. Disabled *DropDownStyle
  36. }
  37. // NewDropDown creates and returns a pointer to a new drop down widget with the specified width.
  38. func NewDropDown(width float32, item *ImageLabel) *DropDown {
  39. dd := new(DropDown)
  40. dd.styles = &StyleDefault.DropDown
  41. dd.litem = item
  42. dd.Panel.Initialize(width, 0)
  43. dd.Panel.Subscribe(OnKeyDown, dd.onKeyEvent)
  44. dd.Panel.Subscribe(OnMouseDown, dd.onMouse)
  45. dd.Panel.Subscribe(OnCursorEnter, dd.onCursor)
  46. dd.Panel.Subscribe(OnCursorLeave, dd.onCursor)
  47. // ListItem
  48. dd.Panel.Add(dd.litem)
  49. // Create icon
  50. dd.icon = NewIconLabel(" ")
  51. dd.icon.SetFontSize(StyleDefault.Font.Size() * 1.3)
  52. dd.icon.SetText(string(assets.ArrowDropDown))
  53. dd.Panel.Add(dd.icon)
  54. /// Create list
  55. dd.list = NewVList(0, 0)
  56. dd.list.bounded = false
  57. dd.list.dropdown = true
  58. dd.list.SetVisible(false)
  59. dd.list.Subscribe(OnMouseDown, dd.onListMouse)
  60. dd.list.Subscribe(OnMouseOut, dd.onListMouse)
  61. dd.list.Subscribe(OnChange, dd.onListChangeEvent)
  62. dd.Panel.Add(dd.list)
  63. dd.update()
  64. dd.recalc()
  65. return dd
  66. }
  67. // Add add a list item at the end of the list
  68. func (dd *DropDown) Add(item *ImageLabel) {
  69. dd.list.Add(item)
  70. }
  71. // InsertAt inserts a list item at the specified position
  72. // Returs true if the item was successfuly inserted
  73. func (dd *DropDown) InsertAt(pos int, item *ImageLabel) {
  74. dd.list.InsertAt(pos, item)
  75. }
  76. // RemoveAt removes the list item from the specified position
  77. // Returs true if the item was successfuly removed
  78. func (dd *DropDown) RemoveAt(pos int) {
  79. dd.list.RemoveAt(pos)
  80. }
  81. // ItemAt returns the list item at the specified position
  82. func (dd *DropDown) ItemAt(pos int) *ImageLabel {
  83. return dd.list.ItemAt(pos).(*ImageLabel)
  84. }
  85. // Returns the currently selected item or nil if not item
  86. // was selected
  87. func (dd *DropDown) Selected() *ImageLabel {
  88. return dd.selItem
  89. }
  90. // SetSelected sets the selected item
  91. func (dd *DropDown) SetSelected(item *ImageLabel) {
  92. dd.list.SetSelected(item, true)
  93. }
  94. // SelectPos selects the item at the specified position
  95. func (dd *DropDown) SelectPos(pos int) {
  96. dd.list.SelectPos(pos, true)
  97. }
  98. // onKeyEvent is called when key event is received when this dropdown has the key focus.
  99. func (dd *DropDown) onKeyEvent(evname string, ev interface{}) {
  100. kev := ev.(*window.KeyEvent)
  101. switch kev.Keycode {
  102. case window.KeyF1:
  103. if dd.list.Visible() {
  104. dd.list.SetVisible(false)
  105. }
  106. default:
  107. return
  108. }
  109. }
  110. // onMouse receives subscribed mouse events over the dropdown
  111. func (dd *DropDown) onMouse(evname string, ev interface{}) {
  112. if evname == OnMouseDown {
  113. // If clickOut list already closed
  114. if dd.clickOut {
  115. dd.clickOut = false
  116. return
  117. }
  118. dd.list.SetVisible(true)
  119. dd.root.SetKeyFocus(dd.list)
  120. return
  121. }
  122. }
  123. // onCursor receives subscribed cursor events over the dropdown
  124. func (dd *DropDown) onCursor(evname string, ev interface{}) {
  125. if evname == OnCursorEnter {
  126. dd.overDropdown = true
  127. dd.update()
  128. return
  129. }
  130. if evname == OnCursorLeave {
  131. dd.overDropdown = false
  132. dd.update()
  133. return
  134. }
  135. }
  136. // onListMouseEvent receives mouse events over the list
  137. func (dd *DropDown) onListMouse(evname string, ev interface{}) {
  138. mev := ev.(*window.MouseEvent)
  139. // List was clicked
  140. if evname == OnMouseDown {
  141. // If click occurred inside the list scrollbar ignore it
  142. if dd.list.vscroll != nil {
  143. if dd.list.vscroll.ContainsPosition(mev.Xpos, mev.Ypos) {
  144. return
  145. }
  146. }
  147. // Otherwise, closes the list
  148. dd.list.SetVisible(false)
  149. //dd.copySelected()
  150. dd.overList = false
  151. dd.update()
  152. return
  153. }
  154. // Hide list when clicked out
  155. if evname == OnMouseOut {
  156. if dd.list.Visible() {
  157. dd.list.SetVisible(false)
  158. }
  159. // If list clickout occurred inside the dropdown, set 'clickOut' to
  160. // indicate that the list was already closed
  161. if dd.Panel.ContainsPosition(mev.Xpos, mev.Ypos) {
  162. dd.clickOut = true
  163. }
  164. }
  165. }
  166. // onListCursor receives subscribed events over the list
  167. func (dd *DropDown) onListCursor(evname string, ev interface{}) {
  168. if evname == OnCursorEnter {
  169. dd.overList = true
  170. dd.update()
  171. return
  172. }
  173. if evname == OnCursorLeave {
  174. dd.overList = false
  175. dd.update()
  176. return
  177. }
  178. }
  179. // copySelected copy to the dropdown panel the selected item
  180. // from the list.
  181. func (dd *DropDown) copySelected() {
  182. dd.selItem = dd.list.Selected()[0].(*ImageLabel)
  183. dd.litem.CopyFields(dd.selItem)
  184. dd.recalc()
  185. dd.Dispatch(OnChange, nil)
  186. }
  187. // onListChangeEvent is called when an item in the list is selected
  188. func (dd *DropDown) onListChangeEvent(evname string, ev interface{}) {
  189. dd.copySelected()
  190. }
  191. // recalc recalculates the dimensions and positions of the dropdown
  192. // panel, children and list
  193. func (dd *DropDown) recalc() {
  194. // Dropdown icon position
  195. posx := dd.Panel.ContentWidth() - dd.icon.Width()
  196. dd.icon.SetPosition(posx, 0)
  197. // List item position and width
  198. ipan := dd.litem.GetPanel()
  199. ipan.SetPosition(0, 0)
  200. //ipan.SetWidth(posx)
  201. height := ipan.Height()
  202. dd.Panel.SetContentHeight(height)
  203. // List position
  204. dd.list.SetWidth(dd.Panel.Width())
  205. dd.list.SetHeight(6*height + 1)
  206. dd.list.SetPositionX(0)
  207. dd.list.SetPositionY(dd.Panel.Height())
  208. }
  209. // update updates the visual state
  210. func (dd *DropDown) update() {
  211. if dd.overDropdown || dd.overList {
  212. dd.applyStyle(dd.styles.Over)
  213. dd.list.ApplyStyle(OverStyle)
  214. return
  215. }
  216. if dd.focus {
  217. dd.applyStyle(dd.styles.Focus)
  218. dd.list.ApplyStyle(FocusStyle)
  219. return
  220. }
  221. dd.applyStyle(dd.styles.Normal)
  222. dd.list.ApplyStyle(NormalStyle)
  223. }
  224. // applyStyle applies the specified style
  225. func (dd *DropDown) applyStyle(s *DropDownStyle) {
  226. dd.SetBordersFrom(&s.Border)
  227. dd.SetBordersColor4(&s.BorderColor)
  228. dd.SetPaddingsFrom(&s.Paddings)
  229. dd.SetColor(&s.BgColor)
  230. }