Added "column-fill" property

This commit is contained in:
anoshenko 2022-12-23 17:27:14 +03:00
parent 3993dbad20
commit c7a7b3ed1e
6 changed files with 65 additions and 4 deletions

View File

@ -1,13 +1,14 @@
# v.11.0 # v.11.0
* Added "tabindex", "order", "background-blend-mode", and "mix-blend-mode" properties * Added "tabindex", "order", "column-fill", "background-blend-mode", and "mix-blend-mode" properties
* Added GetTabIndex, GetOrder, GetBackgroundBlendMode, and GetMixBlendMode functions * Added GetTabIndex, GetOrder, GetColumnFill, GetBackgroundBlendMode, and GetMixBlendMode functions
* ClientItem, SetClientItem, and RemoveAllClientItems method added to Session interface * ClientItem, SetClientItem, and RemoveAllClientItems method added to Session interface
* PropertyWithTag method of DataObject interface renamed to PropertyByTag * PropertyWithTag method of DataObject interface renamed to PropertyByTag
# v.10.0 # v.10.0
* The Canvas.TextWidth method replaced by Canvas.TextMetrics * The Canvas.TextWidth method replaced by Canvas.TextMetrics
* Added support of WebAssembly
# v0.9.0 # v0.9.0

View File

@ -2574,6 +2574,20 @@ ViewBorder описана как
rui.ColorProperty: rui.Black, rui.ColorProperty: rui.Black,
})) }))
### Свойство "column-fill"
Свойство "column-fill" (константа ColumnFill) типа int управляет тем, как содержимое элемента сбалансировано при разбиении на столбцы.
Может принимать одно из двух значений
| Значение | Константа | Имя | Описание |
|:--------:|-------------------|-----------|------------------------------------------------------------------|
| 0 | ColumnFillBalance | "balance" | Контент поровну разделен между столбцами (значение по умолчанию) |
| 1 | ColumnFillAuto | "auto" | Столбцы заполняются последовательно. Контент занимает ровно столько места, сколько ему нужно, что может привести к тому, что некоторые столбцы останутся пустыми. |
Получить значение данного свойства можно с помощью функции
func GetColumnFill(view View, subviewID ...string) int
### Свойство "avoid-break" ### Свойство "avoid-break"
При формировании колонок ColumnLayout может разрывать некоторые типы View, так что начало При формировании колонок ColumnLayout может разрывать некоторые типы View, так что начало

View File

@ -2496,7 +2496,7 @@ which implements the Properties interface (see above). ColumnSeparatorProperty c
Line style can take the following values: Line style can take the following values:
| Value | Constant | Name | Description | | Value | Constant | Name | Description |
|:-----:|------------|----------| ------------------| |:-----:|------------|----------|-------------------|
| 0 | NoneLine | "none" | No frame | | 0 | NoneLine | "none" | No frame |
| 1 | SolidLine | "solid" | Solid line | | 1 | SolidLine | "solid" | Solid line |
| 2 | DashedLine | "dashed" | Dashed line | | 2 | DashedLine | "dashed" | Dashed line |
@ -2550,6 +2550,20 @@ equivalent to
rui.ColorProperty: rui.Black, rui.ColorProperty: rui.Black,
})) }))
### "column-fill" property
The "column-fill" int property (ColumnFill constant) controls how an ColumnLayout's contents are balanced when broken into columns.
Valid values:
| Value | Constant | Name | Description |
|:-----:|-------------------|-----------|------------------------------------------------------------|
| 0 | ColumnFillBalance | "balance" | Content is equally divided between columns (default value) |
| 1 | ColumnFillAuto | "auto" | Columns are filled sequentially. Content takes up only the room it needs, possibly resulting in some columns remaining empty |
You can get the value of this property using the function
func GetColumnFill(view View, subviewID ...string) int
### "avoid-break" property ### "avoid-break" property
When forming columns, ColumnLayout can break some types of View, so that the beginning When forming columns, ColumnLayout can break some types of View, so that the beginning
@ -2807,7 +2821,7 @@ It determines how the text is cut if it goes out of bounds.
This property of type int can take the following values This property of type int can take the following values
| Value | Constant | Name | Cropping Text | | Value | Constant | Name | Cropping Text |
|:-----:|----------------------| -----------|-------------------------------------------------------------| |:-----:|----------------------|------------|-------------------------------------------------------------|
| 0 | TextOverflowClip | "clip" | Text is clipped at the border (default) | | 0 | TextOverflowClip | "clip" | Text is clipped at the border (default) |
| 1 | TextOverflowEllipsis | "ellipsis" | At the end of the visible part of the text '…' is displayed | | 1 | TextOverflowEllipsis | "ellipsis" | At the end of the visible part of the text '…' is displayed |

View File

@ -11,28 +11,41 @@ const (
// Values less than zero are not valid. if the "column-count" property value is 0 then // Values less than zero are not valid. if the "column-count" property value is 0 then
// the number of columns is calculated based on the "column-width" property // the number of columns is calculated based on the "column-width" property
ColumnCount = "column-count" ColumnCount = "column-count"
// ColumnWidth is the constant for the "column-width" property tag. // ColumnWidth is the constant for the "column-width" property tag.
// The "column-width" SizeUnit property specifies the width of each column. // The "column-width" SizeUnit property specifies the width of each column.
ColumnWidth = "column-width" ColumnWidth = "column-width"
// ColumnGap is the constant for the "column-gap" property tag. // ColumnGap is the constant for the "column-gap" property tag.
// The "column-width" SizeUnit property sets the size of the gap (gutter) between columns. // The "column-width" SizeUnit property sets the size of the gap (gutter) between columns.
ColumnGap = "column-gap" ColumnGap = "column-gap"
// ColumnSeparator is the constant for the "column-separator" property tag. // ColumnSeparator is the constant for the "column-separator" property tag.
// The "column-separator" property specifies the line drawn between columns in a multi-column layout. // The "column-separator" property specifies the line drawn between columns in a multi-column layout.
ColumnSeparator = "column-separator" ColumnSeparator = "column-separator"
// ColumnSeparatorStyle is the constant for the "column-separator-style" property tag. // ColumnSeparatorStyle is the constant for the "column-separator-style" property tag.
// The "column-separator-style" int property sets the style of the line drawn between // The "column-separator-style" int property sets the style of the line drawn between
// columns in a multi-column layout. // columns in a multi-column layout.
// Valid values are NoneLine (0), SolidLine (1), DashedLine (2), DottedLine (3), and DoubleLine (4). // Valid values are NoneLine (0), SolidLine (1), DashedLine (2), DottedLine (3), and DoubleLine (4).
ColumnSeparatorStyle = "column-separator-style" ColumnSeparatorStyle = "column-separator-style"
// ColumnSeparatorWidth is the constant for the "column-separator-width" property tag. // ColumnSeparatorWidth is the constant for the "column-separator-width" property tag.
// The "column-separator-width" SizeUnit property sets the width of the line drawn between // The "column-separator-width" SizeUnit property sets the width of the line drawn between
// columns in a multi-column layout. // columns in a multi-column layout.
ColumnSeparatorWidth = "column-separator-width" ColumnSeparatorWidth = "column-separator-width"
// ColumnSeparatorColor is the constant for the "column-separator-color" property tag. // ColumnSeparatorColor is the constant for the "column-separator-color" property tag.
// The "column-separator-color" Color property sets the color of the line drawn between // The "column-separator-color" Color property sets the color of the line drawn between
// columns in a multi-column layout. // columns in a multi-column layout.
ColumnSeparatorColor = "column-separator-color" ColumnSeparatorColor = "column-separator-color"
// ColumnFill is the constant for the "column-fill" property tag.
// The "column-fill" int property controls how an ColumnLayout's contents are balanced when broken into columns.
// Valid values are
// * ColumnFillBalance (0) - Content is equally divided between columns (default value);
// * ColumnFillAuto (1) - Columns are filled sequentially. Content takes up only the room it needs, possibly resulting in some columns remaining empty.
ColumnFill = "column-fill"
) )
// ColumnLayout - grid-container of View // ColumnLayout - grid-container of View
@ -206,3 +219,10 @@ func GetColumnSeparatorColor(view View, subviewID ...string) Color {
border := getColumnSeparator(view, subviewID) border := getColumnSeparator(view, subviewID)
return border.Color return border.Color
} }
// GetColumnFill returns a "column-fill" property value of the subview.
// Returns one of next values: ColumnFillBalance (0) or ColumnFillAuto (1)
// If the second argument (subviewID) is not specified or it is "" then a value from the first argument (view) is returned.
func GetColumnFill(view View, subviewID ...string) int {
return enumStyledProperty(view, subviewID, ColumnFill, ColumnFillBalance, true)
}

View File

@ -459,6 +459,11 @@ var enumProperties = map[string]struct {
BackgroundBlendMode, BackgroundBlendMode,
[]string{"normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"}, []string{"normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"},
}, },
ColumnFill: {
[]string{"balance", "auto"},
ColumnFill,
[]string{"balance", "auto"},
},
} }
func notCompatibleType(tag string, value any) { func notCompatibleType(tag string, value any) {

View File

@ -388,4 +388,11 @@ const (
// The final color has the luminosity of the top color, while using the hue and saturation of the bottom color. // The final color has the luminosity of the top color, while using the hue and saturation of the bottom color.
// This blend mode is equivalent to BlendColor, but with the layers swapped. // This blend mode is equivalent to BlendColor, but with the layers swapped.
BlendLuminosity = 15 BlendLuminosity = 15
// ColumnFillBalance - value of the "column-fill" property: content is equally divided between columns.
ColumnFillBalance = 0
// ColumnFillAuto - value of the "column-fill" property:
// Columns are filled sequentially. Content takes up only the room it needs, possibly resulting in some columns remaining empty.
ColumnFillAuto = 1
) )