Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit/AppGameKit Studio Showcase / [GUI Plugin] Nuklear an immediate-mode graphical user interface

Author
Message
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 4th Oct 2020 21:01 Edited at: 28th Feb 2021 07:05
Hi,

now I am ready to release the plugin. I know there are still some flaws in it. But I think together we will be able to find them and hopefully fix them. Some of them are already known but I can't solve them easily because they are deep inside the nuclear library.

I will update this first post from time to time. Here I will keep a todo list, list fixed bugs and update the download of the plugin.
It might be worth to have a look from time to time. I will announce new versions in this thread as well.

The second post in this thread is kept free for documentation. So the plan!

I hope I will have the discipline to do this regular.

To the plugin:
This plugin is a kind of wrapper around the NuclearUI library for AGK. With over 300 new commands.
A quotation from the nuclear project side.
Quote: ""This is a minimal-state, immediate-mode graphical user interface toolkit written in ANSI C and licensed under public domain. It was designed as a simple embeddable user interface for application and does not have any dependencies, a default render backend or OS window/input handling but instead provides a highly modular, library-based approach, with simple input state for input and draw commands describing primitive shapes as output. So instead of providing a layered library that tries to abstract over a number of platform and render backends, it focuses only on the actual UI.""

Since this library works a lot with pointers I had to write some workarounds for AppGameKit to preserve the functionality.



What do you find in this package?
Two directories and a text file.
In the directory AGK-Project you can find several example projects. These are not very well documented but it is worth to have a look inside.
The directory Plugins contains the actual plugin. How a Plugin is installed, you can find out here. The Plugin is for Windows, Windows64 and Linux.
The text file is a not quite complete function overview. This can be helpful for the many function parameters, which require some functions.



Known issues:
  • Progressbar: When setting values the bar loses focus when leaving the widget.
  • AGK-Window: When scaling the AGK-window the nuclear surface is not scaled. I assumed I had fixed this problem but then found that there were errors within group windows with scrollbar. So I had to go back to the old method. This method automatically adjusts the virtual resolution to the window size.
  • Transparent line under the title when a window is opened in dynamicmode.



TODO:
  • Dokumentation of all commands.
  • UTF-8 support
  • Additional command TooltipBegin with offset parameters.
  • Additional command to set the output path for the log file.



Bugs:
Overlapping windows where the close buttons are on top of each other are partially closed together.
UTF-8 support for clipboard (cut/copy/paste)
Bug with 3d scene display and moving camera. Appearing of a box.
On some devices the screen remains black and only images are rendered.


Change Log:
[2020-10-18]
- [CHG] TreeElementPush & TreeElementImagePush do not work as they should. For internal node identification C/C++ uses the source code name and the source code line of the calling program. This function is missing in AppGameKit and cannot be simulated. It is recommended to use TreeElementPushID & TreeElementImagePushID instead.
- [ADD] EditGetCursorPosition
- [ADD] EditGetMarkStart
- [ADD] EditGetMarkEnd
- [ADD] EditSetMarkStart
- [ADD] EditSetMarkEnd
- [ADD] EditSetCursorPosition
- [FIX] No images were handled under AGK-Studio.
- [FIX] Crash of the app under AGK-Studio. Fixed by creating a dummy object.

[2020-11-19]
- [FIX] UTF-8 glyphs were not created or read correctly.
- [FIX] Horizontal scroll function with the mouse wheel switched off.
- [FIX] StyleLoadFromString could not load the style correctly.
- [FIX] ContextualItemImageText does not find image by name.
- [FIX] Chartvalues capped internaly at their limits (min/max) to avoid display errors.
- [ADD] FontSetGlyphRange and FontAddGlyphRange for UTF-8 support.
- [ADD] nkInputIsMouseClickInRect(button as integer, rect ref as nk_rect)
- [ADD] nkInputHasMouseClickInRect(button as integer, rect ref as nk_rect)
- [ADD] nkInputHasMouseClickDownInRect(button as integerd, rect ref as nk_rect, down as integer)
- [ADD] nkInputIsMouseClickDownInRect(button as integer, rect ref as nk_rect, down as integer)
- [ADD] nkInputAnyMouseClickInRect(rect ref as nk_rect)
- [ADD] nkInputIsMousePrevHoveringRect(rect ref as nk_rect)
- [ADD] nkInputIsMouseHoveringRect(rect ref as nk_rect)
- [ADD] nkInputMouseClicked(button as integer, rect ref as nk_rect)
- [ADD] nkInputGetMouseDelta()
- [ADD] nkWidgetSize()
- [ADD] nkStrokeLine(canvas_slot as integer, p0 as nk_vec2, p1 as nk_vec2, thickness as float, color as nk_color)
- [ADD] nkStrokeCurve(canvas_slot as integer, p0 as nk_vec2, ctrl0 as nk_vec2, ctrl1 as nk_vec2, p1 as nk_vec2, thickness as float, color as nk_color)
- [ADD] nkStrokeRect(canvas_slot as integer, rect as nk_rect, rounding as float, thickness as float, color as nk_color)
- [ADD] nkFillRect(canvas_slot as integer, rect as nk_rect, rounding as float, color as nk_color)
- [ADD] nkFillRectMultiColor(canvas_slot as integer, rect as nk_rect, lt as nk_color, rt as nk_color, rb as nk_color, lb as nk_color)
- [ADD] nkStrokeCircle(canvas_slot as integer, center as nk_vec2, radius as float, thickness as float, color as nk_color)
- [ADD] nkFillCircle(canvas_slot as integer, center as nk_vec2, radius as float, color as nk_color)
- [ADD] nkStrokeArc(canvas_slot as integer, center as nk_vec2, radius as float, a_min as float, a_max as float, thickness as float, color as nk_color)
- [ADD] nkFillArc(canvas_slot as integer, center as nk_vec2, radius as float, a_min as float, a_max as float, color as nk_color)
- [ADD] nkStrokeTriangle(canvas_slot as integer, p0 as nk_vec2, p1 as nk_vec2, p3 as nk_vec2, thickness as float, color as nk_color)
- [ADD] nkFillTriangle(canvas_slot as integer, p0 as nk_vec2, p1 as nk_vec2, p3 as nk_vec2, color as nk_color)
- [ADD] nkDrawText(canvas_slot as integer, rect as nk_rect, label as String, font_name as String, back_col as nk_color, front_col as nk_color)
- [ADD] nkDrawImage(canvas_slot as integer, rect as nk_rect, img_slot as integer, color as nk_color)

[2020-12-12]
- [ADD] TooltipBegin command with additional offset parameters.
- [ADD] Tooltip command with additional offset parameters.
- [FIX] Mouse cursor covers the beginning of the tooltip texts.
- [FIX] Font loading fails in debug mode.

[2021-01-30]
- [ADD] LogSetLocation(path) - Sets the location of the log file.
- [ADD] WindowGetFlags() - Get the current flags of current window.
- [ADD] GetAgkRenderSprite - You can get the render sprite. Supported only if FixedVirtualResulotion is set to 1.
- [ADD] GetAgkRenderImage - You can get the render image to do something special . Supported only if FixedVirtualResulotion is set to 1.
- [ADD] HandleInput(x,y) - Offers the possibility to pass own mouse coordinates.
- [ADD] FixedVirtualResulotion(state) if state is set to 1, the UI scales with the AppGameKit window. default is 0 Virtual resolution is set to device size.
- [FIX] Bug with 3d scene display and moving camera. Appearing of a box.
- [FIX] Solve an Input issue. (repeated chars in input box).
- [FIX] UTF-8 support for clipboard (cut/copy/paste).
- [FIX] Overlapping windows where the close buttons are on top of each other are partially closed together.
- [FIX] UI scaled similar to AGK-Window shrinking - growing with left/right or top/bottom border.
- [FIX] Adjusted window behaviour when scaling.

[2021-02-04]
- [ADD] Style helper function nkStyleSetWindow / nkStyleGetWindow
- [ADD] Style helper function nkStyleSetWindowHeader / nkStyleGetWindowHeader
- [ADD] Style helper function nkStyleSetTab / nkStyleGetTab
- [ADD] Style helper function nkStyleSetProperty / nkStyleGetProperty
- [ADD] Style helper function nkStyleSetScrollbar / nkStyleGetScrollbar
- [ADD] Style helper function nkStyleSetSlider / nkStyleGetSlider
- [ADD] Style helper function nkStyleSetCombo / nkStyleGetCombo
- [ADD] Style helper function nkStyleSetChart / nkStyleGetChart
- [ADD] Style helper function nkStyleSetProgress / nkStyleGetProgress
- [ADD] Style helper function nkStyleSetSelectable / nkStyleGetSelectable
- [ADD] Style helper function nkStyleSetOption / nkStyleGetOption
- [ADD] Style helper function nkStyleSetCheckbox / nkStyleGetCheckbox
- [ADD] Style helper function nkStyleSetButton / nkStyleGetButton
- [ADD] Style helper function nkStyleSetText / nkStyleGetText
- [ADD] Nuklear tags for geany (copy 'nk.agc.tags' file to $(AppGameKit2_Folder)/Tier 1/Editor/data/tags).
- [FIX] Prevents a transparent line from appearing below the title bar when using the NK_WINDOW_DYNAMIC flag.
- [FIX] Drawing correct border color for property-widget.
- [FIX] Typo in LogSetLocation. Now it works correctly.
- [FIX] Linux - fix render position of combined marks.
- [FIX] Copying from one editbox to the next caused the app to crash.
- [FIX] Support for combined marks in utf8 strings.

[2021-02-28]
- [ADD] nkInitStyle in Nuklear.agc was added. If you set the flag parameter to 1 - a dark theme is used. Set it to 2 a light theme will be used. If it is set to 0, leave it at the default theme.
- [ADD] nk.Init now accepts an additional flag. If it is set to 1 (dark) or 2 (light), a new colour and symbol design is used.
- [ADD] New Symbols flags to modify the symbols NK_SYMBOL_INVERT, NK_SYMBOL_COMBINE_RECT, NK_SYMBOL_COMBINE_CIRCLE, NK_SYMBOL_COMBINE_FILLED
- [ADD] New Symbols NK_SYMBOL_CHECK_MARK, NK_SYMBOL_CROSS,
NK_SYMBOL_ANGLE_UP, NK_SYMBOL_ANGLE_DOWN, NK_SYMBOL_ANGLE_LEFT, NK_SYMBOL_ANGLE_RIGHT,
NK_SYMBOL_MENU, NK_SYMBOL_POWER,
NK_SYMBOL_ANGLE_DBL_UP, NK_SYMBOL_ANGLE_DBL_DOWN, NK_SYMBOL_ANGLE_DBL_LEFT, NK_SYMBOL_ANGLE_DBL_RIGHT,
NK_SYMBOL_VLINE, NK_SYMBOL_DBL_VLINE, NK_SYMBOL_HLINE, NK_SYMBOL_DBL_HLINE,
NK_SYMBOL_SKIP_LEFT, NK_SYMBOL_SKIP_RIGHT, NK_SYMBOL_SKIP_UP, NK_SYMBOL_SKIP_DOWN,
NK_SYMBOL_LINE_LEFT, NK_SYMBOL_LINE_RIGHT, NK_SYMBOL_LINE_UP, NK_SYMBOL_LINE_DOWN.
- [CHG] Checkbox draw now a check mark.
- [CHG] When drawing the menu, the complete line is coloured in the back colour of the menu button 'normal'.
- [FIX] Correct Slider names in tag def file.
- [FIX] Correct Checkbox names in tag def file.
- [FIX] Solved another case of transparent lines.


If you would like to support this wrapper you are welcome to donate some coins. I am happy about every cent I get.

Please enjoy this plugin and stay healthy.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)

Attachments

Login to view attachments
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 4th Oct 2020 21:02 Edited at: 17th Oct 2020 06:33
Table of contents




First Steps

Let me show you the code first. After that come the explanations.
Here is a simple example. It opens only a window without function and content.



The first line includes the plugin. Just like any other. The following lines until 'UseNewDefaultFonts' is the AppGameKit default code. I will not explain it now.
With '#insert "Nuklear.agc"' some important constants and functions written in AGK-Basic are included. So it is also important.
'nkInit()' initializes the GUI-engine.

Now comes the main loop. In order for Nuklear to respond to the user's input, the input must be passed from AppGameKit to Nuklear. This can be done with the command 'nk.HandleInput()'.
Next we initialize our first window. For this 'nk.WindowBegin' is responsible with the parameters (from left to right) window title, position of the window (x,y) width and height of the window and the window flags.

Why 'WindowBegin' is in an if statement has the following reason: Nuclear remembers which status the window has. If it is minimized now, the content should not be shown anymore. So 'WindowBegin' returns 0 (false) in this case.

Between 'if' and 'endif' there are all the controls that should appear in the window.
With 'nk.WindowEnd()' we finish the construction of the window.

In order for AppGameKit to display our window, 'nkSync' must be called. The AGK-Sync does not have to be called anymore. This is done by nkSync.
Note that there are commands with and without a dot after nk ( nkSync and nk.WindowEnd() ). The ones with the dot are pure plugin commands and the ones without are commands in AGK-Basic that were inserted via '#insert "../Nuklear.agc"'.



Now we fill our window with some controls. First of all we have to specify which space our controls are allowed to occupy. We do this with 'nk.LayoutRowStatic' which waits for 3 parameters. Height and width of the controls and how many controls are placed next to each other.



Continue with two buttons. Because we want to react to the buttons, we put them into an if statement. We decide to use normal label buttons. Therefore you only need a string parameter as label for the button.


The buttons set or clears the variable 'hello_text$'.

Last but not least we want to bring our variable on the screen/window. For this we have 'nk.Label' which shows a string. The parameters are - the text to display and a flag how the text should be displayed.



NK_TEXT_CENTERED only says that it will be centered vertically and horizontally in the available space.
However, since we want to make the entire window width available to our text, we must first change the layout.


This time we took a dynamic layout. This gives the layout the full width of the window. Again with a height of 30 pixels and the window width is divided into one column.
With NK_TEXT_CENTERED our text is finally displayed in the horizontal center of the window and in the vertical center of the row (30).



The code now looks like this.



I hope this is enough for a short introduction.

next About Window
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
Lupo4mica37
1
Years of Service
User Offline
Joined: 1st Jun 2020
Location:
Posted: 5th Oct 2020 03:10
Awesome!

Does it support Japanese fonts?
????????
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 5th Oct 2020 19:28
Hi MadBit,
I'll use the plugin as soon as possible for a 2D editor that I need.
Right now I am busy at my free time with a game but the editor is a the second priority for me.
Thank you for the release
The Donate button does not work for me. I use the Edge browser
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 5th Oct 2020 20:29
@Lupo4mica37:
Unfortunately not yet. There is still a structure and some functions missing. I will put it on the TODO list. But with low priority.

@george++:
I am looking forward to see what you or the others can achieve with the plugin.
The button should work now. Thanks for the message.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
Lupo4mica37
1
Years of Service
User Offline
Joined: 1st Jun 2020
Location:
Posted: 6th Oct 2020 00:29
Thank you.
????????
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 6th Oct 2020 04:47 Edited at: 6th Oct 2020 04:48
I did a donation.
I hope that community members will support you, since the AppGameKit lacks of a serious Graphical User Interface lib, for the implementation of the tools we need for game development.
When I'll have some stuff that uses your plugin, then I'll post a demo
Good luck with the TODO list
DannyD
4
Years of Service
User Offline
Joined: 29th Aug 2017
Location:
Posted: 11th Oct 2020 14:05
Thanks Madbit... appreciate the effort and hard work....
Check your email.. donation made...
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 13th Oct 2020 07:34
Thank you Danny and George for your donations.

UPDATE:
Parts of the documentation have been updated.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 15th Oct 2020 07:38
UPDATE:
Parts of the documentation have been updated.
About Menus
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
janbo
13
Years of Service
User Offline
Joined: 10th Nov 2008
Location: Germany
Posted: 17th Oct 2020 15:00 Edited at: 17th Oct 2020 16:28
Wow, this is impressive !
Also it runs on Studio if you use #renderer "Basic", except for images I think.
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 17th Oct 2020 21:50 Edited at: 18th Oct 2020 03:40
Run the following program without movung the mouse pointer:


You'll notice that the initial coordinates of the mouse are not correct. After the first mouse move, the coordinates will update
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 18th Oct 2020 06:57
@janbo:
Thanks for this report. I think i've solve this issue.

@george++:
You use the AppGameKit basic functions to determine the mouse coordinates. If they show something wrong, I will not be able to change that.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
janbo
13
Years of Service
User Offline
Joined: 10th Nov 2008
Location: Germany
Posted: 18th Oct 2020 12:50
Did you already made an update ?
I also cant find the nkWindowGetStoredPanelBounds(1) command when testing the demo with those LinkNodes.
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 18th Oct 2020 15:10 Edited at: 18th Oct 2020 15:10
Sorry, not yet but now.

Changelog:
[2020-10-18]
- [CHG] TreeElementPush & TreeElementImagePush do not work as they should. For internal node identification C/C++ uses the source code name and the source code line of the calling program. This function is missing in AppGameKit and cannot be simulated. It is recommended to use TreeElementPushID & TreeElementImagePushID instead.
- [ADD] EditGetCursorPosition
- [ADD] EditGetMarkStart
- [ADD] EditGetMarkEnd
- [ADD] EditSetMarkStart
- [ADD] EditSetMarkEnd
- [ADD] EditSetCursorPosition
- [FIX] No images were handled under AGK-Studio.
- [FIX] Crash of the app under AGK-Studio. Fixed by creating a dummy object.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 18th Oct 2020 18:50 Edited at: 18th Oct 2020 19:38
Quote: "You use the AppGameKit basic functions to determine the mouse coordinates"

Do you mean that I have to use 'nuklear' functions? How can I determine the mouse coordinates?
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 18th Oct 2020 19:22
No. Nuklear use the AppGameKit funtion to get the Mouse coordinates.

You will definitely have this problem with or without the nuclear plugin.

With Nuclear you can get the delta position, but not the absolute coordinates.
InputGetMouseDeltaX
InputGetMouseDeltaY

Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 18th Oct 2020 19:58
OK, thank you MadBit
FYI: In full screen mode the AppGameKit will ignore the virtual screen resolution setting and will use the maximum device resolution
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 18th Oct 2020 20:40
Quote: "FYI: In full screen mode the AppGameKit will ignore the virtual screen resolution setting and will use the maximum device resolution"


Yes, this is a known problem. I described it in the first post. It is the same as the one with the agk-window scaling.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 19th Oct 2020 20:24 Edited at: 19th Oct 2020 20:32
Is there any way to change the size of the Message Box. Please see the image below.


The code is simple:


I noticed that I can write my a message dialog box to replace the 'nkMessageBox' but I post here to note that the calculation of the dialog size may be false
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 20th Oct 2020 04:56
thank you.

Until the next update you can fix it yourself.
In the file NuklearDlg.agc in line 126 you can add the flag NK_WINDOW_DYNAMIC to the flags parameter.
The line should then look like this
nkPopupBegin(NK_POPUP_STATIC, title, NK_WINDOW_DYNAMIC||NK_WINDOW_NO_SCROLLBAR||NK_WINDOW_TITLE, box)
That should be it.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 20th Oct 2020 19:04 Edited at: 20th Oct 2020 19:08
Hi MadBit,
I am having difficulties in creating a window that will display images stored in the media folder. Each image may differ in size from others.
When I load the images I cannot maintain the aspect ratio of each image.

Any idea?
Here is how I load the images

and here is how I display the window (no issues here).
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 21st Oct 2020 05:29 Edited at: 22nd Oct 2020 04:52
Unfortunately there is no function that maintains the aspect ratio.

I would put each of the images into a UDT when loading. and store it in an array.
This UDT would look like this



width, height and aspect do not necessarily have to be saved. It is just easier to access it later.
images[x].width is easier than GetImageWidth(images[x].id).

the load could look like this.

The display in a window looks like this.



The displayed code is not tested and may contain errors. But I hope I could give you one or the other suggestion.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 21st Oct 2020 05:48
Thank you MadBit.
Can't wait to check your suggestion. I am on business trip away from my personal workspace.
I wish I could serve a beer!
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 21st Oct 2020 20:40 Edited at: 21st Oct 2020 20:42
It works for images having the width larger than the height
In the following screenshot you can see the image with the green circle, it is a bit stretched (it is 64x128 pixels. The image with the blue circle it is OK. Its dimensions are 128x64 pixels
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 22nd Oct 2020 04:43
Can I see the code that represents your window?
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 22nd Oct 2020 07:34 Edited at: 22nd Oct 2020 07:34
Quote: "Can I see the code that represents your window?"

Sure, I followed your instructions. Here is how I create the slots:

and here is how I represent the window

I can send you the whole project if you have the time to take a look at it
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 22nd Oct 2020 12:15
I was able to reproduce the problem with the code snippets well.

You can easily solve the problem by adding additional 8 pixels to the width of the button.
nk.LayoutRowPush(64*gWinSprite.img[i].aspect+8)

Why is this so?
The layout automatically sets spaces between the controls, and the button also has spaces between the border and the image, so the image is displayed slightly distorted.
If you add 8 there you will compensate for this.

To see a comparison you can test it by replacing nk.ButtonImage with nk.Image and you will see that the layout is not distorted anymore because nk.Image does not contain a border.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 22nd Oct 2020 12:31
Thank you very much for clarifying it in detail.
Is this an issue that can be resolved later by your plugin, or it depends on the nuklear project itself?
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 22nd Oct 2020 12:47 Edited at: 22nd Oct 2020 12:49
One can dispute whether this is a bug or not. In any case it is caused by the nuclear core.

It would be desirable if ButtonImage had a flag that keeps the aspect ratio of the image.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
Ranietz
AGK Gold Backer
17
Years of Service
Recently Online
Joined: 2nd Sep 2004
Location: Norway
Posted: 22nd Oct 2020 23:29
Hi. Thanks for making this plugin.

I'm trying to use the command "nk.WindowGetWidth()" but it just crash the program (AGK Studio v2020.07.28). Is it not implemented yet or is it a bug?

Here's what I'm trying to do:
Ranietz
AGK Gold Backer
17
Years of Service
Recently Online
Joined: 2nd Sep 2004
Location: Norway
Posted: 23rd Oct 2020 02:48
Sorry. My mistake. I missed the documentation threads in the AppGameKit Classic forum. I see what I did wrong now.
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 24th Oct 2020 09:25
Hi MadBit,
A quick question: Is it possible to disable input handling for specific windows?
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 24th Oct 2020 20:01
yes, with the window flag NK_WINDOW_NOT_INTERACTIVE the window is drawn, but without any function.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 25th Oct 2020 08:40
Thank you. I missed that. This will help to prevent the user interaction when this is needed.
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 25th Oct 2020 08:41
Thank you. I missed that. This will help to prevent the user interaction when this is needed.
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 3rd Nov 2020 16:04 Edited at: 3rd Nov 2020 16:06
Hi MadBit,
Please take a look at the following two lines of code

The code above, is part of code of a nuklear window
If the condition is true an image slot will be shown on the window. If the condition is not true I expect the image (which has been created by the "imgRegionCreate" function) will not show, but the second case does not take place.
Is there any way not display the SLOT_WINBRUSH if the condition "g.winEnt.ent[entIdx].img.animSheet.iFrameCount > 1" is false?

MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 3rd Nov 2020 16:57
This seems to me to be a purely logical problem.
ImageToSlot does not display an image but stores an image in a slot.
I suppose later in the code you will use nk.Image(SLOT_WINBRUSH) to display the image in the window.
There your logic should apply whether it should be displayed or not.

I noticed that your last parameters of ImageToSlot are 0,0,0,0,0.
If you want to put the whole image in the slot then ignore these parameters or you can also declare the last two parameters as -1.
If you want to have only one image section, you can use this function to determine the position and size of the section.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 3rd Nov 2020 17:09
Quote: "If you want to have only one image section, you can use this function to determine the position and size of the section."

This is very important information, since there is no need for the "imgRegionCreate" function.
Quote: "I suppose later in the code you will use nk.Image(SLOT_WINBRUSH) to display the image in the window."

I'll have a closer look in my code and I'll let you know.
Thank you.
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 3rd Nov 2020 18:57
Quote: "I suppose later in the code you will use nk.Image(SLOT_WINBRUSH) to display the image in the window."

You are right. This command was placed outside the condition. Now it works as I want
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 4th Nov 2020 18:41
Hi MadBit,
In the following video you can see that the Yes/No dialog box, is displayed depending to the initial position of its parent window.
I think this shouldn't be the case, since there is a possibility for the Yes/No dialog to be displayed outside the screen, in case the parent window will be placed to the edges of the screen

MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 4th Nov 2020 20:41
You can also set the flag NKDLG_MB_WINDOW as the parameter flags to tell the messagebox to open it as a normal window.
The position is then relative to the screen.
Without this parameter the position is relative to the opened window.
If the message box is to be opened as a window you should not call this function within another window.

But I understand the argument. I will think of something else.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 6th Nov 2020 09:04 Edited at: 6th Nov 2020 09:06
I downloaded the Nuklear 20201018 but I cannot run the Skinning project. I get the error:



Also in my project I get the error:

MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 6th Nov 2020 17:40 Edited at: 6th Nov 2020 17:49
I have looked. Turn slidefloat into SliderFoat but that was always the command.
About the Skinning project - did you take the project out of the current package or an old one?
There I had changed the command but since the release here in the forum it is called 'TreeElementPushID'.

EDIT:
I just noticed that I did not update the project folders. Sorry on the next update it will be correct.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 7th Nov 2020 14:23
I would like to show you the first steps on the implementation of my 2D editor.
This post has nothing to do with my own project, but with Nuklear plugin. I am impressed by how easy and efficient it is.

MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 8th Nov 2020 07:26
This looks great.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 8th Nov 2020 07:56 Edited at: 8th Nov 2020 08:01
Thank you MadBit,
The next step is the integration of a shape editor for the SetSpriteShape command but I didn't decide yet, how this can be implemented. Is it going to be implemented within a Nuklear window or in the main AppGameKit screen?
Since I don't feel very comfortable yet with the Nuklear, I don't know If the plugin can support me with mouse input, pan and zoom operations for drawing commands on a window.
I don't forget that this a GUI lib though
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 8th Nov 2020 09:32 Edited at: 8th Nov 2020 09:38
I have recently completed the documentation for the Draw Comands and Input Commands.
So, yes nuclear offers some support in this direction to a certain point.

Here is an overview of the relevant functions.

Input - Function Overview


Draw Commands - Function Overview


EDIT:
However, I would rather edit it in the AppGameKit surface than in a nuclear window.
But it would also work in a window.
I think the effort is similarly great.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)
george++
AGK Tool Maker
14
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 17th Nov 2020 07:01 Edited at: 17th Nov 2020 07:04
Hi MadBit,
Is it possible to let the mouse wheel to scroll only in vertical direction?
Now, when I use the mouse wheel, the contents of the window are scroll in both directions.
This is not convenient, since there are images in the window that have their width larger than others and horizontal scrolling makes them hide.
Please see the image below:
MadBit
Valued Member
Gold Codemaster
12
Years of Service
User Offline
Joined: 25th Jun 2009
Location: Germany
Posted: 17th Nov 2020 13:08 Edited at: 17th Nov 2020 13:44
Hi,
In this case there is unfortunately no flag or similar. You will have to do that yourself.

If you build your window, which has the scrollbars, you get the scroll position and set the x - value to zero and then write it back after building the window.
Sounds more complicated than it is.

Example:


EDIT: This will not work. Let me keep looking.
Share your knowledge. It\'s a way to achieve immortality. (Tenzin Gyatso)

Login to post a reply

Server time is: 2021-11-28 20:42:52
Your offset time is: 2021-11-28 20:42:52