diff --git a/README.md b/README.md index 676d9a06..66657b17 100644 --- a/README.md +++ b/README.md @@ -128,10 +128,10 @@ Important notice If build of your app is failed due to dlangui or its dependencies, probably you have not upgraded dependencies. Try following: - - dub upgrade --force-remove - dub build --force - +```sh +dub upgrade --force-remove +dub build --force +``` As well, sometimes removing of dub.json.selections can help. @@ -146,11 +146,11 @@ Win32 builds Build and run demo app using DUB: - - git clone --recursive https://github.com/buggins/dlangui.git - cd dlangui/examples/example1 - dub run --build=release - +```sh +git clone --recursive https://github.com/buggins/dlangui.git +cd dlangui/examples/example1 +dub run --build=release +``` To develop using Visual-D or MonoD, open dlangui.sln using Visual D (or dlangui-monod.sln for MonoD) @@ -158,13 +158,13 @@ To develop using Visual-D or MonoD, open dlangui.sln using Visual D (or dlangui- To avoid showing console window add win_app.def file to your package source directory and add line to your dub.json. win_app.def: - - "sourceFiles": ["$PACKAGE_DIR/src/win_app.def"] - +```json +"sourceFiles": ["$PACKAGE_DIR/src/win_app.def"] +``` dub.json: - - "sourceFiles-windows": ["$PACKAGE_DIR/src/win_app.def"], - +```json +"sourceFiles-windows": ["$PACKAGE_DIR/src/win_app.def"], +``` Mac OSX development using Mono-D -------------------------------- @@ -178,17 +178,17 @@ Native Cocoa backend - work is in progress. In some directory, e.g. ~/src/d/ : Clone DlangUI repository - - git clone --recursive https://github.com/buggins/dlangui.git - +```sh +git clone --recursive https://github.com/buggins/dlangui.git +``` Enter dlangui directory - - cd dlangui - +```sh +cd dlangui +``` Open solution file with Mono-D - - dlangui-monod-osx.sln - +``` +dlangui-monod-osx.sln +``` Linux development using Mono-D @@ -200,17 +200,17 @@ Required libraries: libsdl2, x11, libfreetype, libfontconfig and OpenGL. Clone DlangUI repository - - git clone https://github.com/buggins/dlangui.git - +```sh +git clone https://github.com/buggins/dlangui.git +``` Enter dlangui directory - - cd dlangui - +```sh +cd dlangui +``` Open solution file with Mono-D - - dlangui-monod-linux.sln - +``` +dlangui-monod-linux.sln +``` Try running examples: helloworld, example1, tetris, dmledit, spreadsheet, opengl Configurations Debug, Release, Unittest build SDL2+OpenGL versions of apps. @@ -258,17 +258,17 @@ Install GIT, DUB, DMD, MonoDevelop with Mono-D plugin. Clone DlangUI repository - - git clone https://github.com/buggins/dlangui.git - +```sh +git clone https://github.com/buggins/dlangui.git +``` Enter dlangui directory - - cd dlangui - +```sh +cd dlangui +``` Open solution file with Mono-D - - dlangui-monod-windows.sln - +``` +dlangui-monod-windows.sln +``` Try running examples: helloworld, example1, tetris, dmledit, spreadsheet, opengl Configurations Debug, Release, Unittest build SDL2+OpenGL versions of apps. @@ -316,21 +316,21 @@ Install GIT, DUB, DMD, MS Visual Studio (e.g. Community 2013) + VisualD plugin Clone DlangUI repository - - git clone --recursive https://github.com/buggins/dlangui.git - +```sh +git clone --recursive https://github.com/buggins/dlangui.git +``` For DlangIDE development, close dlangide project on the same directory level as dlangui is cloned: - - git clone --recursive https://github.com/buggins/dlangide.git - +```sh +git clone --recursive https://github.com/buggins/dlangide.git +``` Enter dlangui directory - - cd dlangui - +```sh +cd dlangui +``` Open solution file with Visual-D - - dlangui-msvc.sln - +``` +dlangui-msvc.sln +``` Try running examples: helloworld, example1, tetris, dmledit, spreadsheet, opengl Configurations Debug, Release, Unittest build SDL2+OpenGL versions of apps. @@ -384,19 +384,19 @@ Linux builds (DUB) libsdl2, libfreetype, libfontconfig E.g. in Ubuntu, you can use following command to enable SDL2 backend builds: - - sudo apt-get install libsdl2-dev - +```sh +sudo apt-get install libsdl2-dev +``` In runtime, .so for following libraries are being loaded (binary packages required): - - freetype, opengl, fontconfig - +``` +freetype, opengl, fontconfig +``` Build and run on Linux using DUB: - - cd examples/example1 - dub run dlangui:example1 - +```sh +cd examples/example1 +dub run dlangui:example1 +``` Other platforms @@ -418,39 +418,39 @@ Third party components used Hello World -------------------------------------------------------------- +```D +// myproject.d +import dlangui; +mixin APP_ENTRY_POINT; - // 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(); - } - +/// 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", - { - "name": "myproject", - "description": "sample DLangUI project", - - "targetPath": "bin", - "targetType": "executable", - - "dependencies": { - "dlangui": "~master" - } - } + "targetPath": "bin", + "targetType": "executable", + "dependencies": { + "dlangui": "~master" + } +} +``` Hello World using DML -------------------------------------------------------------- @@ -460,89 +460,85 @@ 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; - module app; +/// entry point for dlangui based application +extern (C) int UIAppMain(string[] args) { + // create window + Window window = Platform.instance.createWindow("DlangUI example - HelloWorld", null); - 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" } - } + // 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 { - Button { id: btnOk; text: "Ok" } - Button { id: btnCancel; text: "Cancel" } + CheckBox { id: cb1; text: "checkbox 1" } + CheckBox { id: cb2; text: "checkbox 2" } } } - }); - // 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; - }; + 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(); - } + // 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: - - - dub run dlangui:dmledit - - -It allows to edit QML text and see how it will look like when loaded into app (F5 refreshes view). +```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. @@ -561,8 +557,8 @@ DCD integration: go to definition and autocompletion for D source code. Project page: [https://github.com/buggins/dlangide](https://github.com/buggins/dlangide) How to build and run using DUB: - - git clone https://github.com/buggins/dlangide.git - cd dlangide - dub run - +```sh +git clone https://github.com/buggins/dlangide.git +cd dlangide +dub run +```