From 59aa41ad707a814ea7145248c52f6f16b1c895d3 Mon Sep 17 00:00:00 2001 From: trustable-code Date: Sat, 1 Jul 2017 14:24:18 +0200 Subject: first public preview version --- examples/example_01_basic_app.nim | 61 +++++++++++++++++++ examples/example_01_basic_app.png | Bin 0 -> 1471 bytes examples/example_02_controls.nim | 34 +++++++++++ examples/example_03_layout_container.nim | 86 +++++++++++++++++++++++++++ examples/example_04_msgboxes.nim | 37 ++++++++++++ examples/example_05_handle_window_close.nim | 15 +++++ examples/example_06_keyboard_events.nim | 17 ++++++ examples/example_08_timers.nim | 41 +++++++++++++ examples/example_09_font_size.nim | 25 ++++++++ examples/example_10_drawing.nim | 65 ++++++++++++++++++++ examples/example_11_image_processing_cli.nim | 47 +++++++++++++++ examples/example_12_file_dialogs.nim | 44 ++++++++++++++ examples/example_90_widget_error.nim | 13 ++++ examples/example_91_unhandled_exception.nim | 18 ++++++ 14 files changed, 503 insertions(+) create mode 100755 examples/example_01_basic_app.nim create mode 100755 examples/example_01_basic_app.png create mode 100755 examples/example_02_controls.nim create mode 100755 examples/example_03_layout_container.nim create mode 100755 examples/example_04_msgboxes.nim create mode 100755 examples/example_05_handle_window_close.nim create mode 100755 examples/example_06_keyboard_events.nim create mode 100755 examples/example_08_timers.nim create mode 100755 examples/example_09_font_size.nim create mode 100755 examples/example_10_drawing.nim create mode 100755 examples/example_11_image_processing_cli.nim create mode 100644 examples/example_12_file_dialogs.nim create mode 100755 examples/example_90_widget_error.nim create mode 100755 examples/example_91_unhandled_exception.nim (limited to 'examples') diff --git a/examples/example_01_basic_app.nim b/examples/example_01_basic_app.nim new file mode 100755 index 0000000..97109c2 --- /dev/null +++ b/examples/example_01_basic_app.nim @@ -0,0 +1,61 @@ +# This example shows the basic use of the NiGui toolkit. + +import nigui +# First, import the library. + +app.init() +# Initialization is mandatory. + +var window = newWindow("NiGui Example") +# Create a window with a given title: +# By default, a window is empty and not visible. +# It is played at the center of the screen. +# A window can contain only one control. +# A container can contain multiple controls. + +window.width = 600 +window.height = 400 +# Set the size of the window + +# window.iconPath = "example_01_basic_app.png" +# The window icon can be specified this way. +# The default value is the name of the executable file without extension + ".png" + +var container = newLayoutContainer(Layout_Vertical) +# Create a container for controls. +# By default, a container is empty. +# It's size will adapt to it's child controls. +# A LayoutContainer will automatically align the child controls. +# The layout is set to clhorizontal. + +window.add(container) +# Add the container to the window. + +var button = newButton("Button 1") +# Create a button with a given title. + +container.add(button) +# Add the button to the container. + +var textArea = newTextArea() +# Create a multiline text box. +# By default, a text area is empty and editable. + +container.add(textArea) +# Add the text area to the container. + +button.onClick = proc(event: ClickEvent) = +# Set an event handler for the "onClick" event (here as anonymous proc). + + textArea.addLine("Button 1 clicked, message box opened.") + window.alert("This is a simple message box.") + textArea.addLine("Message box closed.") + +window.show() +# Make the window visible on the screen. +# Controls (containers, buttons, ..) are visible by default. + +app.run() +# At last, run the main loop. +# This processes incoming events until the application quits. +# To quit the application, dispose all windows or call "app.quit()". diff --git a/examples/example_01_basic_app.png b/examples/example_01_basic_app.png new file mode 100755 index 0000000..6ba3e4a Binary files /dev/null and b/examples/example_01_basic_app.png differ diff --git a/examples/example_02_controls.nim b/examples/example_02_controls.nim new file mode 100755 index 0000000..4980ca1 --- /dev/null +++ b/examples/example_02_controls.nim @@ -0,0 +1,34 @@ +# This example shows several controls of NiGui. + +import nigui + +app.init() + +var window = newWindow() + +var container = newLayoutContainer(Layout_Vertical) +window.add(container) + +# Add a Button control: +var button = newButton("Button") +container.add(button) + +# Add a Label control: +var label = newLabel("Label") +container.add(label) + +# Add a TextBox control: +var textBox = newTextBox("TextBox") +container.add(textBox) + +# Add a TextArea control: +var textArea = newTextArea("TextArea\nLine 2\n") +container.add(textArea) + +# Add more text to the TextArea: +for i in 3..30: + textArea.addLine("Line " & $i) + +window.show() + +app.run() diff --git a/examples/example_03_layout_container.nim b/examples/example_03_layout_container.nim new file mode 100755 index 0000000..5310f71 --- /dev/null +++ b/examples/example_03_layout_container.nim @@ -0,0 +1,86 @@ +# This example shows some possibilities to align controls with a LayoutContainer. + +import nigui + +app.init() + +var window = newWindow() +window.width = 800 +window.height = 600 +var mainContainer = newLayoutContainer(Layout_Vertical) +window.add(mainContainer) + +# Row 1: Auto-sized: +var innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.frame = newFrame("Row 1: Auto-sized") +for i in 1..3: + var control = newButton("Button " & $i) + innerContainer.add(control) + +# Row 2: Auto-sized, more padding: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.padding = 10 +innerContainer.frame = newFrame("Row 2: Auto-sized, more padding") +for i in 1..3: + var control = newButton("Button " & $i) + innerContainer.add(control) + +# Row 3: Auto-sized, more spacing: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.spacing = 15 +innerContainer.frame = newFrame("Row 3: Auto-sized, more spacing") +for i in 1..3: + var control = newButton("Button " & $i) + innerContainer.add(control) + +# Row 4: Controls expanded: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.frame = newFrame("Row 4: Controls expanded") +for i in 1..3: + var control = newButton("Button " & $i) + control.widthMode = WidthMode_Expand + innerContainer.add(control) + +# Row 5: Controls centered: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.widthMode = WidthMode_Expand +innerContainer.height = 80 # problem +innerContainer.xAlign = XAlign_Center +innerContainer.yAlign = YAlign_Center +innerContainer.frame = newFrame("Row 5: Controls centered") +for i in 1..3: + var control = newButton("Button " & $i) + innerContainer.add(control) + +# Row 6: Container expanded, spread: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +# innerContainer.height = 80 +innerContainer.widthMode = WidthMode_Expand +innerContainer.xAlign = XAlign_Spread +innerContainer.frame = newFrame("Row 6: Container expanded, spread") +for i in 1..3: + var control = newButton("Button " & $i) + innerContainer.add(control) + +# Row 7: Static size: +innerContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(innerContainer) +innerContainer.widthMode = WidthMode_Expand +innerContainer.xAlign = XAlign_Center +innerContainer.yAlign = YAlign_Center +innerContainer.frame = newFrame("Row 7: Static size") +for i in 1..3: + var control = newButton("Button " & $i) + control.width = 90 * i + control.height = 15 * i + innerContainer.add(control) + + +window.show() +app.run() diff --git a/examples/example_04_msgboxes.nim b/examples/example_04_msgboxes.nim new file mode 100755 index 0000000..eca30a6 --- /dev/null +++ b/examples/example_04_msgboxes.nim @@ -0,0 +1,37 @@ +# This example shows different methods to create message boxes. + +import nigui +import msgbox + +app.init() + +var window = newWindow() +var mainContainer = newLayoutContainer(Layout_Vertical) +window.add(mainContainer) + +var buttons = newLayoutContainer(Layout_Horizontal) +mainContainer.add(buttons) + +var textArea = newTextArea() +mainContainer.add(textArea) + +var button1 = newButton("Example 1") +buttons.add(button1) +button1.onClick = proc(event: ClickEvent) = + window.alert("Hello.\n\nThis message box is created with \"alert()\".") + textArea.addLine("Message box closed") + +var button2 = newButton("Example 2") +buttons.add(button2) +button2.onClick = proc(event: ClickEvent) = + let res = window.msgBox("Hello.\n\nThis message box is created with \"msgBox()\".") + textArea.addLine("Message box closed, result = " & $res) + +var button3 = newButton("Example 3") +buttons.add(button3) +button3.onClick = proc(event: ClickEvent) = + let res = window.msgBox("Hello.\n\nThis message box is created with \"msgBox()\" and has three buttons.", "Title of message box", "Button 1", " Button 2", "Button 3") + textArea.addLine("Message box closed, result = " & $res) + +window.show() +app.run() diff --git a/examples/example_05_handle_window_close.nim b/examples/example_05_handle_window_close.nim new file mode 100755 index 0000000..1f621d6 --- /dev/null +++ b/examples/example_05_handle_window_close.nim @@ -0,0 +1,15 @@ +# This example shows how to handle a window close request. + +import nigui +import msgbox + +app.init() + +var window = newWindow() + +window.onDispose = proc(event: WindowDisposeEvent) = + if window.msgBox("Close the application?", "Close?", "Close", "Abort") != 1: + event.cancel = true + +window.show() +app.run() diff --git a/examples/example_06_keyboard_events.nim b/examples/example_06_keyboard_events.nim new file mode 100755 index 0000000..b36713f --- /dev/null +++ b/examples/example_06_keyboard_events.nim @@ -0,0 +1,17 @@ +# This example shows how to handle keyboard events. + +import nigui + +app.init() + +var window = newWindow() + +var label = newLabel() +window.add(label) + +window.onKeyDown = proc(event: WindowKeyEvent) = + label.text = label.text & "KeyDown event: key: " & $event.key & ", unicode: " & $event.unicode & ", character: " & event.character & "\n" + +window.show() + +app.run() diff --git a/examples/example_08_timers.nim b/examples/example_08_timers.nim new file mode 100755 index 0000000..51c117c --- /dev/null +++ b/examples/example_08_timers.nim @@ -0,0 +1,41 @@ +# This example shows how to use timers. + +import nigui + +app.init() + +var window = newWindow() + +var mainContainer = newLayoutContainer(Layout_Vertical) +window.add(mainContainer) +var buttonContainer = newLayoutContainer(Layout_Horizontal) +mainContainer.add(buttonContainer) + +var textArea = newTextArea() +mainContainer.add(textArea) + +var timer: Timer +var counter = 1 + +proc timerProc(event: TimerEvent) = + textArea.addLine($counter) + counter.inc() + +var button1 = newButton("startTimer()") +buttonContainer.add(button1) +button1.onClick = proc(event: ClickEvent) = + timer = startTimer(500, timerProc) + +var button2 = newButton("startRepeatingTimer()") +buttonContainer.add(button2) +button2.onClick = proc(event: ClickEvent) = + timer = startRepeatingTimer(500, timerProc) + +var button3 = newButton("stopTimer()") +buttonContainer.add(button3) +button3.onClick = proc(event: ClickEvent) = + timer.stop() + +window.show() + +app.run() diff --git a/examples/example_09_font_size.nim b/examples/example_09_font_size.nim new file mode 100755 index 0000000..087200c --- /dev/null +++ b/examples/example_09_font_size.nim @@ -0,0 +1,25 @@ +# This example shows how to change the font size of controls. + +import nigui + +app.init() + +var window = newWindow() +window.width = 500 +window.height = 600 +var container = newLayoutContainer(Layout_Vertical) +window.add(container) + +for i in 12..20: + var innerContainer = newLayoutContainer(Layout_Horizontal) + container.add(innerContainer) + innerContainer.frame = newFrame("Font size: " & $i) + var button = newButton("Button") + button.fontSize = i + innerContainer.add(button) + var label = newLabel("Label") + label.fontSize = i + innerContainer.add(label) + +window.show() +app.run() diff --git a/examples/example_10_drawing.nim b/examples/example_10_drawing.nim new file mode 100755 index 0000000..bab3a6b --- /dev/null +++ b/examples/example_10_drawing.nim @@ -0,0 +1,65 @@ +# This example shows how to draw the surface of a control. + +import nigui + +app.init() +var window = newWindow() +window.width = 500 +window.height = 500 + +var control1 = newControl() +# Creates a drawable control + +window.add(control1) + +var image1 = newImage() +image1.loadFromFile("example_01_basic_app.png") +# Reads the file and holds the image as bitmap in memory + +var image2 = newImage() +image2.resize(2, 2) +# Creates a new bitmap + +image2.canvas.setPixel(0, 0, rgb(255, 0, 0)) +image2.canvas.setPixel(0, 1, rgb(255, 0, 0)) +image2.canvas.setPixel(1, 1, rgb(0, 255, 0)) +image2.canvas.setPixel(1, 0, rgb(0, 0, 255)) +# Modifies single pixels + +control1.onDraw = proc (event: DrawEvent) = + let canvas = event.control.canvas + # A shortcut + + canvas.areaColor = rgb(30, 30, 30) # dark grey + canvas.fill() + # Fill the whole area + + canvas.setPixel(0, 0, rgb(255, 0, 0)) + # Modifies a single pixel + + canvas.areaColor = rgb(255, 0, 0) # red + canvas.drawRectArea(10, 10, 30, 30) + # Draws a filled rectangle + + canvas.lineColor = rgb(255, 0, 0) # red + canvas.drawLine(60, 10, 110, 40) + # Draws a line + + let text = "Hello World!" + canvas.textColor = rgb(0, 255, 0) # lime + canvas.fontSize = 20 + canvas.fontFamily = "Arial" + canvas.drawText(text, 10, 70) + # Outputs a text + + canvas.drawRectOutline(10, 70, canvas.getTextWidth(text), canvas.getTextLineHeight()) + # Draws a rectangle outline + + canvas.drawImage(image1, 10, 120) + # Draws an image in original size + + canvas.drawImage(image2, 120, 120, 50) + # Draws an image stretched + +window.show() +app.run() diff --git a/examples/example_11_image_processing_cli.nim b/examples/example_11_image_processing_cli.nim new file mode 100755 index 0000000..ec0f263 --- /dev/null +++ b/examples/example_11_image_processing_cli.nim @@ -0,0 +1,47 @@ +# This example shows how to do image processing without GUI + +import nigui + +app.init() + +var image1 = newImage() +image1.loadFromFile("example_01_basic_app.png") +# Reads the file and holds the image as bitmap in memory + +var image2 = newImage() +image2.resize(200, 200) + +let canvas = image2.canvas +# A shortcut + +canvas.areaColor = rgb(30, 30, 30) # dark grey +canvas.fill() +# Fill the whole area + +canvas.setPixel(0, 0, rgb(255, 0, 0)) +# Modifies a single pixel + +canvas.areaColor = rgb(255, 0, 0) # red +canvas.drawRectArea(10, 10, 30, 30) +# Draws a filled rectangle + +canvas.lineColor = rgb(255, 0, 0) # red +canvas.drawLine(60, 10, 110, 40) +# Draws a line + +let text = "Hello World!" +canvas.textColor = rgb(0, 255, 0) # lime +canvas.fontSize = 20 +canvas.fontFamily = "Arial" +canvas.drawText(text, 10, 70) +# Outputs a text + +canvas.drawRectOutline(10, 70, canvas.getTextWidth(text), canvas.getTextLineHeight()) +# Draws a rectangle outline + +canvas.drawImage(image1, 10, 120) +# Draws an image in original size + +image2.saveToPngFile("out.png") +# Save the image as PNG file + diff --git a/examples/example_12_file_dialogs.nim b/examples/example_12_file_dialogs.nim new file mode 100644 index 0000000..b1647c3 --- /dev/null +++ b/examples/example_12_file_dialogs.nim @@ -0,0 +1,44 @@ +# This example shows how to use the Open File and Save File As dialogs. + +import nigui + +app.init() + +var window = newWindow() +var mainContainer = newLayoutContainer(Layout_Vertical) +window.add(mainContainer) + +var buttons = newLayoutContainer(Layout_Horizontal) +mainContainer.add(buttons) + +var textArea = newTextArea() +mainContainer.add(textArea) + +var button1 = newButton("Open ...") +buttons.add(button1) +button1.onClick = proc(event: ClickEvent) = + var dialog = newOpenFileDialog() + dialog.title = "Test Open" + dialog.multiple = true + dialog.directory = "/run/media/user/Data/Temp/Downloads/" + dialog.run() + textArea.addLine($dialog.files.len & " files selected") + if dialog.files.len > 0: + for file in dialog.files: + textArea.addLine(file) + +var button2 = newButton("Save as ...") +buttons.add(button2) +button2.onClick = proc(event: ClickEvent) = + var dialog = SaveFileDialog() + dialog.title = "Test Save" + dialog.directory = "/run/media/user/Data/Temp/Downloads/" + dialog.defaultName = "default.txt" + dialog.run() + if dialog.file == "": + textArea.addLine("No path selected") + else: + textArea.addLine(dialog.file) + +window.show() +app.run() diff --git a/examples/example_90_widget_error.nim b/examples/example_90_widget_error.nim new file mode 100755 index 0000000..551ee8a --- /dev/null +++ b/examples/example_90_widget_error.nim @@ -0,0 +1,13 @@ +# This example shows what happens when a nigui widget error occurs. + +import nigui + +app.init() + +var window = newWindow() + +window.add(newButton("Button 1")) # ok +window.add(newButton("Button 2")) # not ok, gives error messages, but program continues + +window.show() +app.run() diff --git a/examples/example_91_unhandled_exception.nim b/examples/example_91_unhandled_exception.nim new file mode 100755 index 0000000..d9f46c0 --- /dev/null +++ b/examples/example_91_unhandled_exception.nim @@ -0,0 +1,18 @@ +# This example shows what happens when an unhandled exception occurs in the main loop. + +import nigui + +app.init() + +var window = newWindow() + +var container = newLayoutContainer() +window.add(container) + +var button = newButton("Raise Exception") +container.add(button) +button.onClick = proc(event: ClickEvent) = + raise newException(Exception, "Test Exception") + +window.show() +app.run() -- cgit v1.2.3