forks
/
dlangui
mirror of https://github.com/buggins/dlangui.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix #638 TextWidget didn't track hover

This commit is contained in:
Grim Maple 2022-11-18 16:19:08 +03:00
parent 171df6864c
commit 7ef1b7e809
3 changed files with 51 additions and 209 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
CODING_STYLE.md
View File

@ -1,3 +1,12 @@
Follow the D Style
===================
From now one, it is advised to follow the [D Style](https://dlang.org/dstyle.html) for ease of future possible integration with
the D community. While the coding style is changing, it is discouraged to submit styling only PRs. Those **will not be merged**.
It's OK to change styling in the code you're submitting.
The below codestyle is outdated, but is kept for historical purposes.
DlangUI Coding Style DlangUI Coding Style
==================== ====================
@ -11,11 +20,11 @@ Use 4 spaces instead of tabs.
Identifiers Identifiers
----------- -----------
Class names: CamelCase with uppercase first letter, e.g.: `LinearLayout`, `GridWidget`. Class names: CamelCase with uppercase first letter, e.g.: `LinearLayout`, `GridWidget`.
Method and property names: camelCase with lowercase first letter, e.g.: `textAlign`, `layoutWidth`. Method and property names: camelCase with lowercase first letter, e.g.: `textAlign`, `layoutWidth`.
Private and protected class and struct fields: \_camelCase prepended with underscore, e.g. `_windowWidth`. Private and protected class and struct fields: \_camelCase prepended with underscore, e.g. `_windowWidth`.
Signal names: camelCase. Signal names: camelCase.
Enum member names: currently, 3 styles are used: JAVA_LIKE, CamelCase and camelCase. TODO: make it consistent? Enum member names: currently, 3 styles are used: JAVA_LIKE, CamelCase and camelCase. TODO: make it consistent?
```D ```D
class MyClass { class MyClass {
private int _magicNumber; private int _magicNumber;
@ -66,7 +75,7 @@ switch(action.id) {
break; break;
} }
``` ```
For classes and structs opening { can be either at end of line or in a new line). For classes and structs opening { can be either at end of line or in a new line).
```D ```D
class Foo { class Foo {
} }

183
README.md
View File

@ -41,60 +41,7 @@ Needs DMD frontend 2.100.2 or newer to build
Widgets Widgets
------- -------
* Widget - base class for all widgets and widget containers, similar to Android's View List of widgets, layouts and other is available in the [Wiki](https://github.com/buggins/dlangui/wiki#widgets)
Currently implemented widgets:
* TextWidget - simple static text (TODO: implement multiline formatting)
* ImageWidget - static image
* Button - simple button with text label
* ImageButton - image only button
* TextImageButton - button with icon and label
* CheckBox - check button with label
* RadioButton - radio button with label
* SwitchButton - a toggle switch button
* GroupBox - frame and caption for grouping other controls
* EditLine - single line edit
* EditBox - multiline editor
* VSpacer - vertical spacer - just an empty widget with layoutHeight == FILL_PARENT, to fill vertical space in layouts
* HSpacer - horizontal spacer - just an empty widget with layoutWidth == FILL_PARENT, to fill horizontal space in layouts
* ScrollBar - scroll bar
* SliderWidget - slider
* ProgressBarWidget - progress bar
* TabControl - tabs widget, allows to select one of tabs
* TabHost - container for pages controlled by TabControl
* TabWidget - combination of TabControl and TabHost
* GridWidgetBase - abstract Grid widget
* StringGrid - grid view with strings content
* TreeWidget - tree view
* ComboBox - combo box with text items
* ToolBar - tool bar with buttons
* StatusLine - control to show misc application statuses
* AppFrame - base class for easy implementation of apps with main menu, toolbars, status bar
Layouts
-------
Similar to layouts in Android
* LinearLayout - layout children horizontally or vertically depending on orientation
* VerticalLayout - just a LinearLayout with vertical orientation
* HorizontalLayout - just a LinearLayout with horizontal orientation
* FrameLayout - all children occupy the same place; usually only one of them is visible
* TableLayout - children are aligned into rows and columns of table
* ResizerWidget - put into LinearLayout between two other widgets to resize them using mouse
* ScrollWidget - allow to scroll its child if its dimensions are bigger than possible
* DockHost - layout with main widget and additional dockable panels around it
* DockWindow - dockable window with caption, usually to be used with DockHost
List Views
----------
Lists are implemented similar to Android UI API.
* ListWidget - layout dynamic items horizontally or vertically (one in row/column) with automatic scrollbar; can reuse widgets for similar items
* ListAdapter - interface to provide data and widgets for ListWidget
* WidgetListAdapter - simple implementation of ListAdapter interface - just a list of widgets (one per list item) to show
Resources Resources
--------- ---------
@ -116,8 +63,8 @@ Styles and themes are a bit similar to ones in Android API.
* Styles are accessible in theme by string ID. * Styles are accessible in theme by string ID.
* Styles can be nested to form hierarchy - when some attribute is missing in style, value from base style will be used. * Styles can be nested to form hierarchy - when some attribute is missing in style, value from base style will be used.
* State substyles are supported: allow to change widget appearance dynamically based on its state. * State substyles are supported: allow to change widget appearance dynamically based on its state.
* Widgets use style attributes directly from assigned style. When some attribute is being changed in widget, it creates its own copy of base style, * Widgets use style attributes directly from assigned style. When some attribute is being changed in widget, it creates its own copy of base style,
which allows to modify some of attributes, while getting base style attributes if they are not changed in widget. This trick can minimize memory usage for widget attributes when which allows to modify some of attributes, while getting base style attributes if they are not changed in widget. This trick can minimize memory usage for widget attributes when
standard values are used. standard values are used.
* Current default theme is similar to one in MS Visual Studio 2013 * Current default theme is similar to one in MS Visual Studio 2013
* Resources can be either embedded into executable or loaded from external resource directory in runtime * Resources can be either embedded into executable or loaded from external resource directory in runtime
@ -211,130 +158,8 @@ Third party components used
Hello World Hello World
-------------------------------------------------------------- --------------------------------------------------------------
```D
// myproject.d
import dlangui;
mixin APP_ENTRY_POINT;
/// entry point for dlangui based application
extern (C) int UIAppMain(string[] args) {
// create window
Window window = Platform.instance.createWindow("My Window", null);
// create some widget to show in window
window.mainWidget = (new Button()).text("Hello world"d).textColor(0xFF0000); // red text
// show window
window.show();
// run message loop
return Platform.instance.enterMessageLoop();
}
```
Sample dub.json:
--------------------------------
```json
{
"name": "myproject",
"description": "sample DLangUI project",
"targetPath": "bin",
"targetType": "executable",
"dependencies": {
"dlangui": "~master"
}
}
```
Hello World using DML
--------------------------------------------------------------
DlangUI supports creation of widgets from markup.
DML - DlangUI Markup Language - similar to QML.
Example of complex UI easy created from text:
```D
module app;
import dlangui;
mixin APP_ENTRY_POINT;
/// entry point for dlangui based application
extern (C) int UIAppMain(string[] args) {
// create window
Window window = Platform.instance.createWindow("DlangUI example - HelloWorld", null);
// create some widget to show in window
//window.mainWidget = (new Button()).text("Hello, world!"d).margins(Rect(20,20,20,20));
window.mainWidget = parseML(q{
VerticalLayout {
margins: 10
padding: 10
backgroundColor: "#C0E0E070" // semitransparent yellow background
// red bold text with size = 150% of base style size and font face Arial
TextWidget { text: "Hello World example for DlangUI"; textColor: "red"; fontSize: 150%; fontWeight: 800; fontFace: "Arial" }
// arrange controls as form - table with two columns
TableLayout {
colCount: 2
TextWidget { text: "param 1" }
EditLine { id: edit1; text: "some text" }
TextWidget { text: "param 2" }
EditLine { id: edit2; text: "some text for param2" }
TextWidget { text: "some radio buttons" }
// arrange some radio buttons vertically
VerticalLayout {
RadioButton { id: rb1; text: "Item 1" }
RadioButton { id: rb2; text: "Item 2" }
RadioButton { id: rb3; text: "Item 3" }
}
TextWidget { text: "and checkboxes" }
// arrange some checkboxes horizontally
HorizontalLayout {
CheckBox { id: cb1; text: "checkbox 1" }
CheckBox { id: cb2; text: "checkbox 2" }
}
}
HorizontalLayout {
Button { id: btnOk; text: "Ok" }
Button { id: btnCancel; text: "Cancel" }
}
}
});
// you can access loaded items by id - e.g. to assign signal listeners
auto edit1 = window.mainWidget.childById!EditLine("edit1");
auto edit2 = window.mainWidget.childById!EditLine("edit2");
// close window on Cancel button click
window.mainWidget.childById!Button("btnCancel").click = delegate(Widget w) {
window.close();
return true;
};
// show message box with content of editors
window.mainWidget.childById!Button("btnOk").click = delegate(Widget w) {
window.showMessageBox(UIString("Ok button pressed"d),
UIString("Editors content\nEdit1: "d ~ edit1.text ~ "\nEdit2: "d ~ edit2.text));
return true;
};
// show window
window.show();
// run message loop
return Platform.instance.enterMessageLoop();
}
```
There is DMLEdit sample app in DlangUI/examples directory.
You can run it with dub:
```sh
dub run dlangui:dmledit
```
It allows to edit DML text and see how it will look like when loaded into app (F5 refreshes view).
Syntax highlight, bracket matching, go to error and other useful features are implemented.
Please refer to the [Wiki](https://github.com/buggins/dlangui/wiki#hello-world) for a hello world example.
DlangIDE project DlangIDE project
------------------------------------------------------------ ------------------------------------------------------------

56
src/dlangui/widgets/controls.d
View File

@ -55,7 +55,7 @@ class VSpacer : Widget {
this() { this() {
styleId = STYLE_VSPACER; styleId = STYLE_VSPACER;
} }
//override void measure(int parentWidth, int parentHeight) { //override void measure(int parentWidth, int parentHeight) {
// measuredContent(parentWidth, parentHeight, 8, 8); // measuredContent(parentWidth, parentHeight, 8, 8);
//} //}
} }
@ -65,27 +65,35 @@ class HSpacer : Widget {
this() { this() {
styleId = STYLE_HSPACER; styleId = STYLE_HSPACER;
} }
//override void measure(int parentWidth, int parentHeight) { //override void measure(int parentWidth, int parentHeight) {
// measuredContent(parentWidth, parentHeight, 8, 8); // measuredContent(parentWidth, parentHeight, 8, 8);
//} //}
} }
/// static text widget /// static text widget
class TextWidget : Widget { class TextWidget : Widget {
this(string ID = null, string textResourceId = null) { this(string ID = null, string textResourceId = null)
{
super(ID); super(ID);
styleId = STYLE_TEXT; styleId = STYLE_TEXT;
_text.id = textResourceId; _text.id = textResourceId;
trackHover = true;
} }
this(string ID, dstring rawText) {
this(string ID, dstring rawText)
{
super(ID); super(ID);
styleId = STYLE_TEXT; styleId = STYLE_TEXT;
_text.value = rawText; _text.value = rawText;
trackHover = true;
} }
this(string ID, UIString uitext) {
this(string ID, UIString uitext)
{
super(ID); super(ID);
styleId = STYLE_TEXT; styleId = STYLE_TEXT;
_text = uitext; _text = uitext;
trackHover = true;
} }
/// max lines to show /// max lines to show
@ -97,20 +105,20 @@ class TextWidget : Widget {
/// get widget text /// get widget text
override @property dstring text() const { return _text; } override @property dstring text() const { return _text; }
/// set text to show /// set text to show
override @property Widget text(dstring s) { override @property Widget text(dstring s) {
_text = s; _text = s;
requestLayout(); requestLayout();
return this; return this;
} }
/// set text to show /// set text to show
override @property Widget text(UIString s) { override @property Widget text(UIString s) {
_text = s; _text = s;
requestLayout(); requestLayout();
return this; return this;
} }
/// set text resource ID to show /// set text resource ID to show
@property Widget textResource(string s) { @property Widget textResource(string s) {
_text = s; _text = s;
requestLayout(); requestLayout();
return this; return this;
} }
@ -119,9 +127,9 @@ class TextWidget : Widget {
override void measure(int parentWidth, int parentHeight) { override void measure(int parentWidth, int parentHeight) {
FontRef font = font(); FontRef font = font();
uint w; uint w;
if (maxLines == 1) if (maxLines == 1)
w = MAX_WIDTH_UNSPECIFIED; w = MAX_WIDTH_UNSPECIFIED;
else { else {
w = parentWidth - margins.left - margins.right - padding.left - padding.right; w = parentWidth - margins.left - margins.right - padding.left - padding.right;
@ -198,7 +206,7 @@ class SwitchButton : Widget {
checked = !checked; checked = !checked;
return super.handleClick(); return super.handleClick();
} }
override void measure(int parentWidth, int parentHeight) { override void measure(int parentWidth, int parentHeight) {
DrawableRef img = backgroundDrawable; DrawableRef img = backgroundDrawable;
int w = 0; int w = 0;
int h = 0; int h = 0;
@ -246,7 +254,7 @@ class ImageWidget : Widget {
/// get drawable image id /// get drawable image id
@property string drawableId() { return _drawableId; } @property string drawableId() { return _drawableId; }
/// set drawable image id /// set drawable image id
@property ImageWidget drawableId(string id) { @property ImageWidget drawableId(string id) {
_drawableId = id; _drawableId = id;
_drawable.clear(); _drawable.clear();
requestLayout(); requestLayout();
@ -270,7 +278,7 @@ class ImageWidget : Widget {
@property ImageWidget drawable(string drawableId) { @property ImageWidget drawable(string drawableId) {
if (_drawableId.equal(drawableId)) if (_drawableId.equal(drawableId))
return this; return this;
_drawableId = drawableId; _drawableId = drawableId;
_drawable.clear(); _drawable.clear();
requestLayout(); requestLayout();
return this; return this;
@ -287,7 +295,7 @@ class ImageWidget : Widget {
_drawable.clear(); // remove cached drawable _drawable.clear(); // remove cached drawable
} }
override void measure(int parentWidth, int parentHeight) { override void measure(int parentWidth, int parentHeight) {
DrawableRef img = drawable; DrawableRef img = drawable;
int w = 0; int w = 0;
int h = 0; int h = 0;
@ -391,7 +399,7 @@ class ImageTextButton : HorizontalLayout {
override @property Widget fontWeight(int weight) { _label.fontWeight(weight); return this; } override @property Widget fontWeight(int weight) { _label.fontWeight(weight); return this; }
/// returns font size in pixels /// returns font size in pixels
override @property int fontSize() const { return _label.fontSize; } override @property int fontSize() const { return _label.fontSize; }
/// Set label font size /// Set label font size
override @property Widget fontSize(int size) { _label.fontSize(size); return this; } override @property Widget fontSize(int size) { _label.fontSize(size); return this; }
/// returns font family /// returns font family
override @property FontFamily fontFamily() const { return _label.fontFamily; } override @property FontFamily fontFamily() const { return _label.fontFamily; }
@ -419,7 +427,7 @@ class ImageTextButton : HorizontalLayout {
_label.alignment = Align.Bottom | Align.HCenter; _label.alignment = Align.Bottom | Align.HCenter;
} }
} }
return this; return this;
} }
protected void initialize(string drawableId, UIString caption) { protected void initialize(string drawableId, UIString caption) {
@ -530,7 +538,7 @@ class RadioButton : ImageTextButton {
} }
private bool blockUnchecking = false; private bool blockUnchecking = false;
void uncheckSiblings() { void uncheckSiblings() {
Widget p = parent; Widget p = parent;
if (!p) if (!p)
@ -555,14 +563,14 @@ class RadioButton : ImageTextButton {
return super.handleClick(); return super.handleClick();
} }
override protected void handleCheckChange(bool checked) { override protected void handleCheckChange(bool checked) {
if (!blockUnchecking) if (!blockUnchecking)
uncheckSiblings(); uncheckSiblings();
invalidate(); invalidate();
checkChange(this, checked); checkChange(this, checked);
} }
} }
/// Text only button /// Text only button
@ -609,7 +617,7 @@ class Button : Widget {
action = a; action = a;
} }
override void measure(int parentWidth, int parentHeight) { override void measure(int parentWidth, int parentHeight) {
FontRef font = font(); FontRef font = font();
Point sz = font.textSize(text); Point sz = font.textSize(text);
measuredContent(parentWidth, parentHeight, sz.x, sz.y); measuredContent(parentWidth, parentHeight, sz.x, sz.y);
@ -640,14 +648,14 @@ interface OnDrawHandler {
/// canvas widget - draw on it either by overriding of doDraw() or by assigning of onDrawListener /// canvas widget - draw on it either by overriding of doDraw() or by assigning of onDrawListener
class CanvasWidget : Widget { class CanvasWidget : Widget {
Listener!OnDrawHandler onDrawListener; Listener!OnDrawHandler onDrawListener;
this(string ID = null) { this(string ID = null) {
super(ID); super(ID);
} }
override void measure(int parentWidth, int parentHeight) { override void measure(int parentWidth, int parentHeight) {
measuredContent(parentWidth, parentHeight, 0, 0); measuredContent(parentWidth, parentHeight, 0, 0);
} }