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 Classic Chat / OryUI - AGK UI Framework - WIP

Author
Message
george++
AGK Tool Maker
16
Years of Service
User Offline
Joined: 13th May 2007
Location: Thessaloniki, Hellas
Posted: 11th Jul 2020 22:11 Edited at: 12th Jul 2020 08:35
Link
Hello Kevin,
I ran most of the examples from the GitHub.
There is a lot of work to be done. For example a scrolling list cannot be implemented yet, using the existing scroll bars and list components
A property sheet editor would be a very nice addition
I tried to get rid the trash icon from the list without success
Some of the functions are useless, i.e. : OryUIPinSpriteToCentreOfSprite(sprBox2, sprBox1, 0, 0) has no meaning. Soon you'll realize that you'll need a more general approach, like 'Sizers'. These components are containers that can distribute or align (horizontally or vertically) GUI elements
I don't think that the AppGameKit language is capable of doing these tasks.
I like the way you organized the project and especially the parameter system you implemented. You tried to put some rules on all functions and this makes it easy to learn and use them.
You targeted to professional programing design.
But the language is oriented to game creation and I think you cannot achieve your goals
I any case I wish you good luck.
Back to top
Profile PM Email
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 12th Jul 2020 08:26 Edited at: 12th Jul 2020 08:29
Link
Thanks. Each component has been built out of need for my app. I only have one app that I work on in AppGameKit and its not a game.

As for some of your points I do have scrolling lists in my app. I also have lists that recycle as you scroll, i.e. as you scroll up the items at the top of the list that go off screen move to the bottom but its not something thats easy to share and its a fair bit of extra code that doesn't fit with the current OryUI framework where most things are called by a simple function.

I disagree that OryUIPinSpriteToCentreOfSprite is useless. Think of a button sprite that has an icon sprite. You can pin the icon sprite to the middle of button sprite with one line without having to change/set offsets. And the two extra number parameters at the end let you offset the icon sprite from the centre of the button sprite if needed.

TGC should really consider looking at doing something similar and better, and aim to get more native looking elements that I've been able to achieve on my own.

As for the future of OryUI I'm finding that AppGameKit probably isn't suitable for my app anymore so there may be less updates for OryUI as I look at other alternatives to AGK. One that lets me use native UI elements and is updated a lot more regularly.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
Bengismo
6
Years of Service
User Offline
Joined: 20th Nov 2017
Location: Yorkshire, England
Posted: 12th Jul 2020 18:26 Edited at: 12th Jul 2020 18:27
Link
Quote: "As for the future of OryUI I'm finding that AppGameKit probably isn't suitable for my app anymore so there may be less updates for OryUI as I look at other alternatives to AGK. One that lets me use native UI elements and is updated a lot more regularly."


I think it would be a big shame to loose a very capable AppGameKit coder such as yourself to another coding solution. Anyone who happily shares their UI code like you have and contributes to the forum is worth supporting.

I really hope that TGC sees this and responds to the current app submission issues and to the setimmersivemode() issue too. Im not entirely sure that anyone could create and release an app on the apple store with the current version of AppGameKit, it seems to have quite a few problems? I know that Apple are being a real pain and creating some if not most of the issues but TGC need to be able to respond correctly. Apple deciding to stop supporting opengl is the main reason why we even needed a vulkan renderer, so they have been a pain.

Anyway, hope that TGC bounces back with some fixes quick.
Back to top
Profile PM
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 13th Jul 2020 08:20
Link
Thanks @Bengismo. I've been doing a Udemy course for another language and really enjoying it. Although I have only really been following along so it is hard to say what it will be like when I finally start to use it but am looking to move my app over to something else. As it's not a game it seems logical to move away from a game engine/language.

I'm thankful for AppGameKit and have had a lot of fun with it. My app would never have seen the light if it wasn't for it.

Migrating my app will obviously take time so not up and leaving right now. Will see how Studio progresses over the next couple of updates to see if it gets any better or worse.

It will be interesting to see what UI components they make available to us for our games and apps and how they look and feel.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
traumvogel
10
Years of Service
User Offline
Joined: 2nd Jul 2013
Location:
Posted: 19th Sep 2020 22:22
Link
Hi Kevin, do you mind telling which language are you looking at as alternative?
Back to top
Profile PM
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 22nd Sep 2020 14:24
Link
I was looking at Ionic and Flutter at the time of my original post, but that was for an app. I think my next project will be a game. I will use either AppGameKit or Godot for it. I don't have much time to start on it yet. Not until I've handed over my current app and no longer manage it.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
DEKR
5
Years of Service
User Offline
Joined: 23rd Mar 2019
Location:
Posted: 17th Nov 2020 08:40
Link
Great fiche! Very usable content !! Thnk U Kevin !!! Wish you good luck!!
Back to top
Profile PM
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 29th Nov 2020 20:12 Edited at: 29th Nov 2020 20:25
Link
Other than OryUIStartTrackingTouch() and OryUIEndTrackingTouch() are there any other general functions i need to call to initialize/manage OryUI?

What is the syntax for setting the point size of my text (SetEditBoxTextSize()) in the OryUICreateTextfield(string) function string?


Using the following syntax;
textfield3 = OryUICreateTextfield("position:11,40;backgroundColor:100,240,241,255;strokeColor:231,76,60,255;labelText:Location")

I get this output (The text is there but it is tiny)

Attachments

Login to view attachments
Back to top
Profile PM
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 29th Nov 2020 21:35 Edited at: 29th Nov 2020 21:46
Link
I know we've already discussed this on Discord, but in case it proves helpful to others I will reply here too

Those are the two lines that are required in the main do loop



The issue with the textfield in your screenshot is that this particular component relies heavily on having the listener function called in the main do loop too. This listener function is what sizes the text based on what you're doing with the textfield, and whether or not the textfield currently has text or not.

So for example:



Quite a lot of the interactive components have their own listener function that would need to be called each frame (while it's needed on the screen).

Lastly, the text size and other parts of the textfield is all calculated based on the height of the textfield. To make it look nicer than the plain AppGameKit textfields it adds the textfield to a larger sprite, and the real editbox is 60% of the height you gave. So if you set the textfield size as 10% when creating, the background sprite will be 10% in height, and the editbox will be 6% size and placed neatly within the sprite background so that you can't really see real AppGameKit editbox, the border is removed/set the same as the background sprite so that it blends in nicely.

One thing to keep in mind is that OryUI was built around my app which uses percentage sizing and positioning. While you probably could use it with pixel based positioning and sizing, I haven't actually really tested it all, and you will need to overwrite a lot of the default sizes otherwise the components in your app will be really small. One example is the textfield which has a defualt size of 7.3. If you're using pixel based sizing that will only be 7.3 pixels high and would therefore be really small. You would have to set the size when creating the textfield as 20 or 30 depending on your needs.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 29th Nov 2020 21:43 Edited at: 29th Nov 2020 22:13
Link
There is one other function that you may use a lot, but unfortunately I haven't documented it well. It's mentioned in the OryUITouch wiki page. And that is OryUISetScreenScrollLimits(minX, maxX, minY, maxY)

https://github.com/KevinCrossDCL/OryUI/wiki/OryUITouch

What this does is sets the maximum size of the screen/content you want to scroll. AppGameKit and this framework doesn't know how long your content scrolls down so you have to set it in that function. In my ChastiKey app I have an agc file for each screen which are called in the main do loop, each with a different view offset, so screen 1 at offset x = 0, screen 2 at offset x = 100, and screen 3 at offset x = 200. In each screen agc file I call this OryUISetScreenScrollLimits function to set how far the user can scroll down. On screen 3 with content that is say 275% in length i.e. 2.75 screens down, I would call it like this: OryUISetScreenScrollLimits(200, 200, 0, 275). I also like to add an extra 50% to it so that the last item on the screen when scrolled up ends roughly in the middle i.e. OryUISetScreenScrollLimits(200, 200, 0, 275 + 50) but that's just personal preference.

If I didn't want scrolling at screen 3 then I would set it as OryUISetScreenScrollLimits(200, 200, 0, 0). You may also be able to leave it out completely and not call it at all if you didn't want it to scroll.

When you're positioning components and elements on your screen you will need to track the last Y position to work out the overall height/length of the content/screen

When scrolling the content on a desktop (on a Mac at least) the app flickers a bit. It is fine on mobile devices though. Haven't found out why it does this, but also haven't spent too long looking.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 1st Dec 2020 11:38 Edited at: 1st Dec 2020 11:44
Link
v0.13a of OryUI is now available on GitHub: https://github.com/KevinCrossDCL/OryUI

In this version flick to scroll (also known as inertia scrolling) has been added, thanks to BlinkOk. It is on by default, but if you want to disable it you can call OryUIDisableFlickScroll(). I will be using this inertia scrolling in a near future version of my app as it seems to be working ok.

The speed of the scroll is based on a default 60 fps, if you're running an app/game that is lower or higher than that then you may find that the scroll is a little too fast or a little too slow. You can fix this by either overwriting the default value in the global variable oryUIMaxSyncRate# that's used for calculating scroll speed and friction, to match what you set in SetSyncRate at the top of your app i.e.:

oryUIMaxSyncRate# = 30.0

Or use a function that was created to do this:

OryUISetSyncRate(30.0, 0)

The second parameter is the same as the mode parameter you'd set in SetSyncRate()

What this function does is call SetSyncRate() and store the desired FPS in the global variable oryUIMaxSyncRate#



The closer this value is (oryUIMaxSyncRate#) to the value you chose in SetSyncRate(), the better the scrolling and friction/slow down rate of the scrolling will be.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 9th Dec 2020 14:33 Edited at: 9th Dec 2020 14:36
Link
v0.14a is now available on GitHub: https://github.com/KevinCrossDCL/OryUI

I have decided to stick with it as it has potential, so I've started on a kitchen sink demo, and thanks to BlinkOk's suggestions on Discord there's now a clear structure on how screens should probably be laid out and managed, something that I wasn't ever really clear on myself.

It also now has a logo. Yay!

This version is mainly a bug fixing one, but there were a few changes, and additions:

* To keep inline with some other frameworks I've changed all references of components to widgets.
* 1,500+ Material icons have been added to the framework. These have been combined into 4 images that uses subimages to pull out and display the correct icon. Combining them all into 4 images keeps the overall framework size down.
* There's now an examples folder which contains two projects: A simple tabs, and menu app, and a kitchen sink app showing some of the widgets available with OryUI. It doesn't show them all at the moment but more will be added to it soon/over time.

I've attached a number of screenshots from the kitchen sink demo to show what it looks like.
OryUI - A WIP AGK2 UI Framework

Attachments

Login to view attachments
Back to top
Profile PM Email
Hardyx
3
Years of Service
User Offline
Joined: 23rd Dec 2020
Location: Madrid, Spain
Posted: 24th Dec 2020 23:40
Link
Awesome library!! Allows to create mobile applications that seems like native "Material Design" apps.
I think could be developed like a UI script in separated files, like the xml interface files are used in Android.
Each designed page in a separed file and loaded in the main program. Well I'm dreaming, I know this could be more complex.
But in current state is good. Good job!
Back to top
Profile PM
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 25th Dec 2020 07:25 Edited at: 25th Dec 2020 07:25
Link
@Hardyx, even in my first/current app where I used OryUI I have each screen in a separate AGC file. I wouldn't recommend doing it any other way. The only difference now is that thanks to the help of some users here, OryUI now has a better structured way to lay out those screen scripts, or at least a recommended way. An example of that layout can be found in the GitHub main README file. You can also see a working multiple screen app looking at the kitchen sink demo that is available in the repository.

I do think that it would be possible for someone to write an AppGameKit script that read and converted an XML file to OryUI/AGK code, if that was their preferred way of laying out UI for screens. I don't think that would be my preferred method though.

If we're dreaming, then all we really need is for someone in TGC to look at OryUI and put it, or an alternative and more professional/fuller version in a future version of Studio. Would certainly help entice in more developers I'm sure. Those that aren't interested in games, but want to build apps.
OryUI - A WIP AGK2 UI Framework
Back to top
Profile PM Email
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 28th Dec 2020 22:21 Edited at: 28th Dec 2020 22:25
Link
I've added two new widgets to OryUI and have updated the kitchen sink demo with them.

OryUICheckbox
OryUISwitch

https://github.com/KevinCrossDCL/OryUI

Forgot to mention that OryUIEditAvatarScreen was added to the kitchen sink demo in the last release. Screenshots attached.
OryUI - A WIP AGK2 UI Framework

Attachments

Login to view attachments
Back to top
Profile PM Email
Blendman
10
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 19th Feb 2021 10:13 Edited at: 19th Feb 2021 10:15
Link
Hi
I have tried your OryUI, which is really great.
You have made a very good job !

I have some erros when using the examples :


It should be :

or if I create a OryUi directory in the main directory :


Do you know if there is a way to create a sort of Text Editor. I have tried to change OryUITextFiled.agc.
I have changed the line (and add the text size parameter):


It works but, I don't know if it's possible to have a "real" text editor because the editbox doesn't allow to use the "enter" key to add a line, when we push the "enter" key, it close the edition of editbox.

cheers
AGK2 tier1 - http://www.dracaena-studio.com
Back to top
Profile PM Website
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 19th Feb 2021 11:06 Edited at: 19th Feb 2021 11:18
Link
When you say text editor, do you mean a multi line textfield i.e. textarea? If so then no, you wouldn't use the OryUITextfield as it hasn't been designed for it. The framework needs a OryUITextarea widget, and for it to be designed so that it looks like the Materials textarea example here: https://material.io/components/text-fields#input-types (rounded edges not required)

You could probably copy OryUITextfield call it OryUITextarea and modify it to do what you need, while still keeping the same design, or just create your own version outside of the framework. If you do design one for the framework then it would be great if you created a new branch for it on GitHub so that it can be merged into the master branch.

I tend to only update OryUI as and when I need something new, and I've not yet needed a textarea.

As for the path of OryUI, the GitHub readme says: #insert "..\OryUI\OryUI.agc" which is if you had OryUI folder at the same level as your project i.e.

-AGKProject
--main.agc
--media
-OryUI
--OryUI.agc

The Kitchen Sink main.agc file has ../../../ like you said, but that's because the kitchen sink demo is nested 2 or 3 folders deep from the main OryUI framework. Did you download the whole repository and keep everyhing as is, or did you move/place the Kitchen-Sink demo somewhere else?
OryUI - A WIP AGK2 UI Framework
AGK Examples & Mini Projects (GitHub)
Back to top
Profile PM Email
Back to top

Login to post a reply

Server time is: 2024-04-18 12:44:39
Your offset time is: 2024-04-18 12:44:39