Updated Readme

This commit is contained in:
Alexei Anoshenko 2022-01-16 19:11:23 -05:00
parent 043778d56b
commit d51688b04f
6 changed files with 235 additions and 31 deletions

View File

@ -1,6 +1,9 @@
# v0.5.0
* Added HasFocus function to the View interface
* Added the following properties to TableView: "selection-mode", "allow-selection", "current", "current-style", "current-inactive-style"
* Added the following events to TableView: "table-cell-selected", "table-cell-clicked", "table-row-selected", "table-row-clicked",
* Bug fixing
# v0.4.0

View File

@ -1,6 +1,6 @@
MIT License
Copyright (c) 2021 Alexei Anoshenko
Copyright (c) 2021-2022 Alexei Anoshenko
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal

View File

@ -3260,6 +3260,7 @@ Cell(row, column int) возвращает содержимое ячейки т
* rui.Color
* rui.View
* fmt.Stringer
* rui.VerticalTableJoin, rui.HorizontalTableJoin
Свойству "content" можно также присваивать следующие типы данных
@ -3314,11 +3315,11 @@ Cell(row, column int) возвращает содержимое ячейки т
В этом случае таблица будет иметь следующий вид
|------|----------------|
| | |
| |-------|--------|
| | | |
|------|-------|--------|
|------|----------------|
| | |
| |-------|--------|
| | | |
|------|-------|--------|
Если в качестве значения свойства "content" используется [][]interface{}, то для объединения
ячеек используются пустые структуры
@ -3421,7 +3422,110 @@ TableColumnStyle объявлена как
| 2 | CenterAlign | "center" | Выравнивание по центру |
| 3, 4 | BaselineAlign | "baseline" | Выравнивание по базовой линии |
Для горизонтального выравнивания используется свойство "text-align"
Для горизонтального выравнивания используется свойство "text-align".
Получить значение данного свойства можно с помощью функции
func GetTableVerticalAlign(view View, subviewID string) int
### Свойство "selection-mode"
Свойство "selection-mode" (константа SelectionMode) типа int определяет режим
выделения (подсвечивания) элементов таблицы. Доступные режимы:
* NoneSelection (0). Режим по умолчанию. В данном режиме нельзя выделять элементы таблицы. Таблица не может
получить фокус ввода.
* CellSelection (1). В данном режиме может выделяться (подсвечиваться) одна ячейка таблицы.
Ячейка выделяется интерактивно с помощью мыши или клавиатуры (с использованием клавиш управления курсором).
В данном режиме таблица может получить фокус ввода. В данном режиме таблица генерирует два вида
событий: "table-cell-selected" и "table-cell-clicked" (о них ниже).
* RowSelection (2). В данном режиме может выделяться (подсвечиваться) только строка таблицы целиком.
В данном режиме таблица похожа на ListView. Строка выделяется интерактивно с помощью мыши или клавиатуры
(с использованием клавиш управления курсором). В данном режиме таблица может получить фокус ввода.
В данном режиме таблица генерирует два вида событий: "table-row-selected" и "table-row-clicked" (о них ниже).
Получить значение данного свойства можно с помощью функции
func GetSelectionMode(view View, subviewID string) int
### Свойство "current"
Свойство "current" (константа Current) задает координаты выбранной ячейки/строки
в виде структуры
type CellIndex struct {
Row, Column int
}
Если ячейка не выбрана, то значения полей Row и Column будут меньше 0.
В режиме RowSelection значение поля Column игнорируется. Также в данном режиме
свойству "current" можно присваивать значение типа int (индекс строки).
Получить значение данного свойства можно с помощью функции
func GetTableCurrent(view View, subviewID string) CellIndex
### Свойство "allow-selection"
По умолчанию вы можете выделить любую ячейку/строку таблицы. Однако часто необходимо запретить
выбор определенных элементов. Свойство "selection-mode" (константа SelectionMode) позволяет
задать такое правило.
В режиме CellSelection данному свойству присваивается реализация интерфейса
type TableAllowCellSelection interface {
AllowCellSelection(row, column int) bool
}
а в режиме RowSelection - реализация интерфейса
type TableAllowRowSelection interface {
AllowRowSelection(row int) bool
}
Функция AllowCellSelection/AllowRowSelection должна возвращать "true" если ячейка/строка
может быть выделена и "false" если ячейку/строку запрещено выделять.
### События "table-cell-selected" и "table-cell-clicked"
Событие "table-cell-selected" генерируется в режиме CellSelection когда пользователь выделил
ячейку таблицы с помощью мыши или клавиатуры.
Событие "table-cell-clicked" возникает если пользователь кликает мышью по ячейке таблицы
(при этом если она не выделена, то сначала возникает событие "table-cell-selected") или
нажимает клавишу Enter или пробел
Основной слушатель данных событий имеет следующий формат:
func(TableView, int, int)
где второй аргумент это индекс строки ячейки, третий - индекс столбца
Можно также использовать слушателя следующего формата:
func(int, int)
### События "table-row-selected" и "table-row-clicked"
Событие "table-row-selected" генерируется в режиме RowSelection когда пользователь выделил
строку таблицы с помощью мыши или клавиатуры.
Событие "table-row-clicked" возникает если пользователь кликает мышью по строке таблицы
(при этом если она не выделена, то сначала возникает событие "table-row-selected") или
нажимает клавишу Enter или пробел
Основной слушатель данных событий имеет следующий формат:
func(TableView, int)
где второй аргумент это индекс строки.
Можно также использовать слушателя следующего формата:
func(int)
## Пользовательский View

131
README.md
View File

@ -1301,7 +1301,7 @@ Lines are split on newlines, on "br" elements, and optionally to fill inline box
* Lines are wrapped on any spaces, including in the middle of a sequence of spaces.
* Spaces take up space and do not hang at the ends of lines, which means they affect the internal dimensions (min-content and max-content).
The table below shows the behavior of various values of the "white-space" property.
The table below shows the behavior of various values of the "white-space" property.
| | New lines | Spaces and Tabs | Text wrapping | End of line spaces | End-of-line other space separators |
|-----------------------|-----------|-----------------|---------------|--------------------|------------------------------------|
@ -1448,7 +1448,8 @@ You can get the value of this property using the function
#### "text-indent" property
The "text-indent" (TextIndent constant) SizeUnit property determines the size of the indent (empty space) before the first line of text.
The "text-indent" (TextIndent constant) SizeUnit property determines the size of the indent (empty space)
before the first line of text.
You can get the value of this property using the function
@ -1514,7 +1515,7 @@ You can get the value of this property using the function
#### "writing-mode" property
The "writing-mode" (WritingMode constant) int property defines how the lines of text are arranged
vertically or horizontally, as well as the direction in which the lines are displayed.
Possible values are:
Possible values are:
| Value | Constant | Description |
|:-----:|-----------------------|------------------------------------------------------------------|
@ -1871,8 +1872,8 @@ The Touch structure describes a single touch and has the following fields
| ClientY | float64 | The vertical position of the mouse relative to the upper left corner of the application |
| ScreenX | float64 | Horizontal position of the mouse relative to the upper left corner of the screen |
| ScreenY | float64 | Vertical position of the mouse relative to the upper left corner of the screen |
| RadiusX | float64 | The x-radius of the ellipse, in pixels, that most closely delimits the area of contact with the screen. |
| RadiusY | float64 | The y-radius of the ellipse, in pixels, that most closely delimits the area of contact with the screen. |
| RadiusX | float64 | The x-radius of the ellipse, in pixels, that most closely delimits the area of contact with the screen. |
| RadiusY | float64 | The y-radius of the ellipse, in pixels, that most closely delimits the area of contact with the screen. |
| RotationAngle | float64 | The angle (in degrees) to rotate the ellipse clockwise, described by the radiusX and radiusY parameters, to best cover the contact area between the user and the surface. |
| Force | float64 | The amount of pressure from 0.0 (no pressure) to 1.0 (maximum pressure) that the user applies to the surface. |
@ -2038,8 +2039,8 @@ relative to each other. The property can take the following values:
| 3 | EndToStartOrientation | Child elements are laid out in a line from end to beginning. |
The start and end positions for StartToEndOrientation and EndToStartOrientation depend on the value
of the "text-direction" property. For languages written from right to left (Arabic, Hebrew),
the beginning is on the right, for other languages - on the left.
of the "text-direction" property. For languages written from right to left (Arabic, Hebrew),
the beginning is on the right, for other languages - on the left.
### "wrap" property
@ -2610,7 +2611,7 @@ For a multi-line editor, auto-wrap mode can be enabled. The bool property "wrap"
If "wrap" is off (default), then horizontal scrolling is used.
If enabled, the text wraps to a new line when the EditView border is reached.
The following functions can be used to get the values of the properties of an EditView:
The following functions can be used to get the values of the properties of an EditView:
func GetText(view View, subviewID string) string
func GetHint(view View, subviewID string) string
@ -2665,7 +2666,7 @@ The value of the "date-picker-value" property can also be read using the functio
func GetNumberPickerValue(view View, subviewID string) float64
The entered values may be subject to restrictions. For this, the following properties are used:
The entered values may be subject to restrictions. For this, the following properties are used:
| Property | Constant | Restriction |
|--------------------|------------------|-------------------|
@ -2678,7 +2679,7 @@ Assignments to these properties can be the same value types as "date-picker-valu
By default, if "date-picker-type" is equal to NumberSlider, the minimum value is 0, maximum is 1.
If "date-picker-type" is equal to NumberEditor, then the entered numbers, by default, are limited only by the range of float64 values.
You can read the values of these properties using the functions:
You can read the values of these properties using the functions:
func GetNumberPickerMinMax(view View, subviewID string) (float64, float64)
func GetNumberPickerStep(view View, subviewID string) float64
@ -3027,8 +3028,8 @@ will be positioned relative to each other. The property can take the following v
| 3 | EndToStartOrientation | Elements are arranged in a row from end to beginning. |
The start and end positions for StartToEndOrientation and EndToStartOrientation depend
on the value of the "text-direction" property. For languages written from right to left
(Arabic, Hebrew), the beginning is on the right, for other languages - on the left.
on the value of the "text-direction" property. For languages written from right to left
(Arabic, Hebrew), the beginning is on the right, for other languages - on the left.
You can get the value of this property using the function
@ -3224,6 +3225,7 @@ Cell(row, column int) returns the contents of a table cell. The Cell() function
* rui.Color
* rui.View
* fmt.Stringer
* rui.VerticalTableJoin, rui.HorizontalTableJoin
The "content" property can also be assigned the following data types
@ -3277,11 +3279,11 @@ The "row-span" property specifies how many cells to merge vertically, and the "c
In this case, the table will look like this
|------|----------------|
| | |
| |-------|--------|
| | | |
|------|-------|--------|
|------+----------------|
| | |
| +-------+--------|
| | | |
|------+-------+--------|
If [][]interface{} is used as the value of the "content" property, then empty structures are used to merge cells
@ -3385,6 +3387,101 @@ the vertical alignment of data within a table cell. Valid values:
For horizontal alignment, use the "text-align" property
You can get the value of this property using the function
func GetTableVerticalAlign(view View, subviewID string) int
### "selection-mode" property
The "selection-mode" property (SelectionMode constant) of the int type determines the mode of selection (highlighting) of table elements. Available modes:
* NoneSelection (0). Default mode. In this mode, you cannot select table elements. The table cannot receive input focus.
* CellSelection (1). In this mode, one table cell can be selected (highlighted).
The cell is selected interactively using the mouse or keyboard (using the cursor keys).
In this mode, the table can receive input focus. In this mode, the table generates two types of events: "table-cell-selected" and "table-cell-clicked" (see below).
* RowSelection (2). In this mode, only the entire table row can be selected (highlighted).
In this mode, the table is similar to a ListView. The row is selected interactively
with the mouse or keyboard (using the cursor keys). In this mode, the table can receive input focus.
In this mode, the table generates two types of events: "table-row-selected" and "table-row-clicked" (see below).
You can get the value of this property using the function
func GetSelectionMode(view View, subviewID string) int
### "current" property
The "current" property (Current constant) sets the coordinates of the selected cell/row as a structure
type CellIndex struct {
Row, Column int
}
If the cell is not selected, then the values of the Row and Column fields will be less than 0.
In RowSelection mode, the value of the Column field is ignored. Also in this mode,
the "current" property can be assigned a value of type int (row index).
You can get the value of this property using the function
func GetTableCurrent(view View, subviewID string) CellIndex
### "allow-selection" property
By default, you can select any cell/row of the table. However, it is often necessary to disable the selection of certain elements. The "selection-mode" property (SelectionMode constant) allows you to set such a rule.
In CellSelection mode, this property is assigned the implementation of the interface
type TableAllowCellSelection interface {
AllowCellSelection(row, column int) bool
}
and in RowSelection mode this property is assigned the implementation of the interface
type TableAllowRowSelection interface {
AllowRowSelection(row int) bool
}
The AllowCellSelection/AllowRowSelection function must return "true"
if the cell/row can be selected and "false" if the cell/row cannot be selected.
### "table-cell-selected" and "table-cell-clicked" events
The "table-cell-selected" event is fired in CellSelection mode when the user has selected
a table cell with the mouse or keyboard.
The "table-cell-clicked" event occurs if the user clicks on a table cell (and if it is not selected,
the "table-cell-selected" event occurs first) or presses the Enter or Space key.
The main listener for these events has the following format:
func(TableView, int, int)
where the second argument is the cell row index, the third argument is the column index
You can also use a listener in the following format:
func(int, int)
### "table-row-selected" and "table-row-clicked" events
The "table-row-selected" event is fired in RowSelection mode when the user has selected
a table row with the mouse or keyboard.
The "table-row-clicked" event occurs if the user clicks on a table row (if it is not selected,
the "table-row-selected" event fires first) or presses the Enter or Space key.
The main listener for these events has the following format:
func(TableView, int)
where the second argument is the row index.
You can also use a listener in the following format:
func(int)
## Custom View
A custom View must implement the CustomView interface, which extends the ViewsContainer and View interfaces.

View File

@ -286,7 +286,7 @@ func (table *tableViewData) normalizeTag(tag string) string {
}
func (table *tableViewData) Focusable() bool {
return GetSelectionMode(table, "") != NoneSelection
return GetTableSelectionMode(table, "") != NoneSelection
}
func (table *tableViewData) Get(tag string) interface{} {
@ -594,7 +594,7 @@ func (table *tableViewData) propertyChanged(tag string) {
htmlID := table.htmlID()
session := table.Session()
switch GetSelectionMode(table, "") {
switch GetTableSelectionMode(table, "") {
case CellSelection:
updateProperty(htmlID, "tabindex", "0", session)
updateProperty(htmlID, "onfocus", "tableViewFocusEvent(this, event)", session)
@ -790,7 +790,7 @@ func (table *tableViewData) htmlProperties(self View, buffer *strings.Builder) {
buffer.WriteRune('"')
}
if selectionMode := GetSelectionMode(table, ""); selectionMode != NoneSelection {
if selectionMode := GetTableSelectionMode(table, ""); selectionMode != NoneSelection {
buffer.WriteString(` onfocus="tableViewFocusEvent(this, event)" onblur="tableViewBlurEvent(this, event)" data-focusitemstyle="`)
buffer.WriteString(table.currentStyle())
buffer.WriteString(`" data-bluritemstyle="`)
@ -864,7 +864,7 @@ func (table *tableViewData) htmlSubviews(self View, buffer *strings.Builder) {
view.Init(session)
ignorCells := []struct{ row, column int }{}
selectionMode := GetSelectionMode(table, "")
selectionMode := GetTableSelectionMode(table, "")
var allowCellSelection TableAllowCellSelection = nil
if allow, ok := adapter.(TableAllowCellSelection); ok {

View File

@ -87,10 +87,10 @@ func GetTableCellStyle(view View, subviewID string) TableCellStyle {
return nil
}
// GetSelectionMode returns the mode of the TableView elements selection.
// GetTableSelectionMode returns the mode of the TableView elements selection.
// Valid values are NoneSelection (0), CellSelection (1), and RowSelection (2).
// If the second argument (subviewID) is "" then a value from the first argument (view) is returned.
func GetSelectionMode(view View, subviewID string) int {
func GetTableSelectionMode(view View, subviewID string) int {
if subviewID != "" {
view = ViewByID(view, subviewID)
}
@ -154,7 +154,7 @@ func GetTableCurrent(view View, subviewID string) CellIndex {
}
if view != nil {
if selectionMode := GetSelectionMode(view, ""); selectionMode != NoneSelection {
if selectionMode := GetTableSelectionMode(view, ""); selectionMode != NoneSelection {
if tableView, ok := view.(TableView); ok {
return tableView.getCurrent()
}