haxeui / haxeui-kha Goto Github PK

If you have a component with width or height set to a percentage and you adjust the window's size, the top-most component does not reflect the changes. This works on the standard html5 target. Haven't been able to test krom.

Expected Behavior

The component extends to fit to the size of the window.

Current Behavior

Only the size of the window at the very start of the program is respected and then it never changes.

Possible Solution

I tried looking for any code dealing with resizing in the kha-backend, or events, and I couldn't find any traces.

Steps to Reproduce (for bugs)

<?xml version="1.0" encoding="utf-8"?>
<hbox id="main" width="100%" height="100%">
    <!-- <style source="../css/main.css" /> -->

    <style>
        #main {
            background-color: green;
        }
    </style>
</hbox>

Your Environment

• Version used: Latest Core/Kha/HTML5
• Environment name and version: Kha-HTML5
• Operating System: Ubuntu bionic

Expected Behavior

Must be displayed list of dropdown's items.

Current Behavior

Does not nothing after mouse click.

Test app / minimal test case

Sample available here.

Your Environment

haxe 3.4.2
kha from git
haxeui-kha from git
haxeui-core form git

Thanks.

It would be nice to allow haxeui-kha (and possibly all other backends) to inject code to handle event mapping. This would be advantageous as it allows, for example, for a HaxeUI application to be put into a 3D scene and co-ord translation logic to be applied for mouse events (instead of the default processing)

Expected Behavior

The ability to side step haxeui-kha event mapping

Current Behavior

At the moment, when haxeui-core adds an event, a mapEvent function is called in the backend, this functions holds onto the event listener and the event in question in a map, it then links up an actual event using Khas Mouse.get().notify

Possible Solution

What may be a better system is to have a class defined in module.xml, this would default to something sensible, this could then be called instead meaning that 3rd part code could be injected into the system. This class could also have an easy way to then dispatch these events via the ComponentBase

eg:

switch (type) {
    case MouseEvent.MOUSE_OVER:
        if (_eventMap.exists(MouseEvent.MOUSE_OVER) == false) {
            _mapper.map(MouseEvent.MOUSE_OVER, listener);
            _eventMap.set(MouseEvent.MOUSE_OVER, listener);
        }
}

it would be nice to get some input from @luboslenco if this makes sense and is the right way to be doing things.

Expected Behavior

A simple window with one image (jpg).

Current Behavior

Blank screen.

Test app / minimal test case

Sample available here.

Your Environment

Haxe 3.4.2
Kha from git
haxeui-core from git
haxeui-kha from git

Thanks.

Expected Behavior

Get image files

Current Behavior

The bytes are loaded from haxe.Resources but when trying to get the Image object from kha we get crapped data. This seems to be caused by the Js engine that recycles the data before we get it back. Hence, we get data that is null.
Here is the output:

 Trace: TypeError: Cannot read property 'width' of null
    at $hxClasses.kha.Image.get_realWidth (<anonymous>:50598:30)
    at <anonymous>:8490:36
    at Function.kha_Image.fromEncodedBytes (<anonymous>:50448:2)
    at $hxClasses.haxe.ui.ToolkitAssets.imageFromBytes (<anonymous>:8489:13)
    at $hxClasses.haxe.ui.ToolkitAssets.getImageFromHaxeResource (<anonymous>:8484:8)
    at <anonymous>:8634:14
    at $hxClasses.haxe.ui.ToolkitAssets.getImageInternal (<anonymous>:8479:4)
    at $hxClasses.haxe.ui.ToolkitAssets.getImage (<anonymous>:8628:10)
    at $hxClasses.haxe.ui.util.ImageLoader.load (<anonymous>:31113:33)
    at $hxClasses.haxe.ui.components._Image.ResourceBehaviour.validateData (<anonymous>:14510:15)
Trace: TypeError: Cannot read property 'width' of null
    at $hxClasses.kha.Image.get_realWidth (<anonymous>:50598:30)
    at <anonymous>:8490:36
    at Function.kha_Image.fromEncodedBytes (<anonymous>:50448:2)
    at $hxClasses.haxe.ui.ToolkitAssets.imageFromBytes (<anonymous>:8489:13)
    at $hxClasses.haxe.ui.ToolkitAssets.getImageFromHaxeResource (<anonymous>:8484:8)
    at <anonymous>:8634:14
    at $hxClasses.haxe.ui.ToolkitAssets.getImageInternal (<anonymous>:8479:4)
    at $hxClasses.haxe.ui.ToolkitAssets.getImage (<anonymous>:8628:10)
    at $hxClasses.haxe.ui.util.ImageLoader.load (<anonymous>:31113:33)
    at $hxClasses.haxe.ui.components._Image.ResourceBehaviour.validateData (<anonymous>:14510:15)

Possible Solution

This pull request removes the issue in the short-term. In the long-term this issue needs to be investigated in Krom.

Steps to Reproduce (for bugs)

1. Have a dialog be visible(the X to close the window is an image so you should crash)

Context

Have a dialog open

Your Environment

This issue happens only in

• Version used: Git haxeui-core and haxeui-kha
• Environment name and version (e.g. Chrome 39, node.js 5.4): Krom
• Operating System and version (desktop or mobile): Linux and Windows
• Issue doesn't appear: In Kore app and html5

something that has just popped up trying out haxeui-kha.

this error pops up right away
/usr/local/lib/haxe/lib/haxeui-kha/git/haxe/ui/backend/TextDisplayBase.hx:16: characters 16-34 : kha._Assets.FontList has no field arial

this is only from having things imported & not in actual use.

import haxe.ui.Toolkit;
import haxe.ui.core.Screen;
import haxe.ui.containers.HBox;
import haxe.ui.components.HSlider;

cant seem to see what the problem is to fix it on my end. just following what i have & have seen before with getting haxeui working

cheers

Expected Behavior

• Control + arrow keys should move cursor word by word
• Control + a should select all text
• Control + c should copy to the clip board
• Control + v should paste from the clip board

Current Behavior

• Control + arrow keys move cursor by single character
• Control + a does nothing
• Control + c does nothing on HTML5 and segfaults on linux (though I believe the segfault is Kha and not HaxeUI)
• Control + v does nothing

Steps to Reproduce (for bugs)

1. Use a HaxeUI app with a TextField
2. Try keyboard combos shown in 'expected behaviour'

Test app / minimal test case

Kha HaxeUI skeleton with <textfield placeholder="Test" width="100%">
should be sufficient.

Context

Search box for searching assets in application does not behave as expected.

Your Environment

• Version used: git
• Environment name and version (e.g. Chrome 39, node.js 5.4): hxcpp / Kha git
• Operating System and version (desktop or mobile): Arch Linux
• Link to your project: Closed Source

When editing textfields of numbersteppers with float values if we press repeatedly the arrows to select a section and then try to use backspace to remove text we create an error in how the fonts are rendered.

Expected Behavior

No bug should occur when editing the textfield of a numberstepper. I.e. the issue could be coming from the numberstepper adding to the pos value when using the arrow keys.

Current Behavior

When trying to edit textfields of numbersteppers it's bug out and jams the UI. The error message in the debug console outputs this:

TypeError: Cannot read property 'xadvance' of undefined
    at kha_KravurImage.getCharWidth (/home/jsnadeau/Kha/Sources/kha/Kravur.hx:99:28)
    at kha_KravurImage.charactersWidth (/home/jsnadeau/Kha/Sources/kha/Kravur.hx:117:13)
    at kha_Kravur.widthOfCharacters (/home/jsnadeau/Kha/Sources/kha/Kravur.hx:207:15)
    at haxe_ui_backend_kha_TextField.render (/home/jsnadeau/foundsdk/haxeui-kha/haxe/ui/backend/kha/TextField.hx:866:44)
    at haxe_ui_core_TextInput.renderTo (/home/jsnadeau/foundsdk/haxeui-kha/haxe/ui/backend/TextInputImpl.hx:101:9)
    at haxe_ui_components_TextField.renderTo (/home/jsnadeau/foundsdk/haxeui-kha/haxe/ui/backend/ComponentImpl.hx:163:13)
    at haxe_ui_components_NumberStepper.renderTo (/home/jsnadeau/foundsdk/haxeui-kha/haxe/ui/backend/ComponentImpl.hx:169:13)

Possible Solution

If the issue is coming from the numberstepper incrementing/decrementing to the pos value when using the arrow keys removing this feature when editing the text could be a solution.

Steps to Reproduce (for bugs)

1. Start editing textfield of numberstepper
2. Try selecting a section, then use backspace while using the arrows.

Media

Test app / minimal test case

Context

Trying to have editable numbersteppers

Your Environment

• Version used: haxeui-kha git version
• Environment name and version (e.g. Chrome 39, node.js 5.4): kha debug-html5
• Operating System and version (desktop or mobile): Linux debian 10

See the sample code here: https://github.com/sh-dave/haxeui-kha-testsuite/blob/master/src/kenneyButtonFlicker/Main.hx

Expected Behavior

• When you hover the button with the mouse, the texture should not disappear.

Current Behavior

• When you hover the button with the mouse, the texture will disappear for a single frame.
• See the screenshot below. It's a debug-html5 build (electron) showing the devtools. I'm highlighted the frame where the the mouse entered the button and the texture disappeared, only the button text is visible. All frames before or after this are fine.

Steps to Reproduce (for bugs)

1. Clone the haxeui-kha-testsuite and open in vscode with the Kha Extension Pack installed
2. Edit the khafile.js and uncomment the line // suite.addParameter('--main kenneyButtonFlicker.Main'); to pull in the proper Main function, comment out any other that might be active.

Media

Your Environment

• Version used:

  • haxeui-core@5f4a1feb
  • haxeui-kha@df552b0f
  • haxeui-theme-kenney@ddc4cd04

• Environment name and version (e.g. Chrome 39, node.js 5.4):

  • debug-html5 build

• Operating System and version (desktop or mobile):

  • Linux + Windows Desktop

• Link to your project:

  • https://github.com/sh-dave/haxeui-kha-testsuite

Icons included in the default styles (which end up as haxe resources) are not showing. This is because currently there isnt a method to extract them and turn them into kha.Image. See: https://github.com/haxeui/haxeui-kha/blob/master/haxe/ui/backend/AssetsBase.hx#L36

Expected Behavior

That it should be possible to turn haxe resources (bytes) into usable and valid kha images

Possible Solution

Either dig into kha and see how it does it or ask Rob (as usual!), he mentioned some time ago about possibly exposing functions to handle this, may or may not have already happened. Need to investigate

Steps to Reproduce (for bugs)

Add a scrollbar, no up/down images as there are in html5.

Media

Your Environment

Latest kha (git)
Latest HaxeUI (git)
Haxe 3.2.1

Expected Behavior

When using Toolkit.scale greater than 1.0 (trying to get a decent sized ui for an android test build), the image component gets smaller for some reason. I expected the image to stay the same size, only the button should get bigger?

(What i originally wanted to use is actually the styles background-image: xxx.png property. But this one doesn't allow to specify the scaleMode (fit, fill, fitinside, ...) for when the component size doesn't match the image dimensions, so i tried with an image component as a quick "fix". Should i add another issue/feature request for this?)

Current Behavior

Toolkit.scale = 1.0

Toolkit.scale = 2.0

Toolkit.scale = 3.0

Steps to Reproduce (for bugs)

@:xml('
<box styleNames="my-view">
	<style>
		.my-view {
			width: 100%;
			height: 100%;
		}

		.logo {
			width: 100%;
			height: 100%;
		}
	</style>

	<image resource="big_kha_Logo.png" styleNames="logo" />
	<button text="CLICK" styleNames="click-me" />
</box>'
)
private class View extends Box {
	public function new() {
		super();
	}
}

class Main {
	public static function main() {
		kha.System.start({ width: Std.int(632 / 2), height: Std.int(612 / 2) }, function( _ ) {
			kha.Assets.loadEverything(function() {
				haxe.ui.Toolkit.theme = 'dark';
				haxe.ui.Toolkit.init({});
				haxe.ui.core.Screen.instance.addComponent(new View());
				haxe.ui.core.Screen.instance.options.noBatch = true;
				haxe.ui.Toolkit.scale = 3.0;

				kha.System.notifyOnFrames(function( fbs ) {
					final fb = fbs[0];
					final g2 = fb.g2;

					g2.begin(true, 0xff004040);
						haxe.ui.core.Screen.instance.renderTo(g2);
					g2.end();
				});
			});
		});
	}
}

Your Environment

latest git everything

Expected Behavior

Must be entered text from keyboard and displayed in textfield/textarea.

Current Behavior

Does not nothing after keyboard key pressed.

Test app / minimal test case

Samples available here (TextArea) and here (TextField).

Your Environment

Haxe 3.4.2
Kha from git
haxeui-core from git
haxeui-kha from git

Thanks.

This essentially effects button icons, images, anything like that. I have set up a test project where it initially creates a render target and sets the haxeui data to it. It appears to render. It sets the icon of a button to the image and it sets the resource of an image to the render target. However, if you press the button it basically repeats the exact same thing but any subsequent presses of the button will render the graphics as nothing.

Expected Behavior

Updating the icon/image-resource should not cause the graphics to null.

Current Behavior

Pressing the button after the initial load causes the graphics to become null.

Steps to Reproduce (for bugs)

Code included.

1. Create a render target, set image resource to it
2. Repeat this step in an event, like a button press

Context

This may be causing problems elsewhere with Kha as I'm seeing other graphical glitches in my main app that seem somewhat similar in concept but not directly related HaxeUI. But for HaxeUI we should expect to be able to change the graphics of images or icons without them clearing.

Your Environment

• Version used: latest
• Environment name and version (e.g. Chrome 39, node.js 5.4): Chrome Debugger
• Operating System and version (desktop or mobile): Windows 10

After pressing "delete" and "end" a few times the application crashes.

Expected Behavior

End should move the caret to the end, and then delete should do nothing (as usual)

Current Behavior

Text starts moving around like crazy.. Do it a few times and it fatally crashes on web.

Possible Solution

Neglect the existance of the kha textbox.

Steps to Reproduce (for bugs)

1. Open http://haxeui.org/shared/kha-textarea/
2. Go to somewhere in the middle of a sentence.
3. Press "delete" followed by "end" a few times

Media

Test app / minimal test case

http://haxeui.org/shared/kha-textarea/

Context

It has affected me very deeply mentally... It crashed.... :(

Your Environment

Specifically web, I have not tried on DX, GL, Metal or any of the 9999 other backends Kha supports (it's crazy)

See the sample code here: https://github.com/sh-dave/haxeui-kha-testsuite/blob/master/src/delayedAdd/Main.hx

Expected Behavior

The component should be visible initially, without resizing the window.

Current Behavior

When you start the sample, nothing is shown. Only when you then resize the window, the button suddenly appears.

1. The outer View component contains some css styling to center the nested button. If you comment out the style tag, the button will correctly be shown initially in the top/left corner.

2. If you add the main View to the screen during startup, and only add the nested button after some delay, it will also show correctly (verifiable with the removed code in the #if 0 sections).

Steps to Reproduce (for bugs)

1. Clone the haxeui-kha-testsuite and open in vscode with the Kha Extension Pack installed
2. Edit the khafile.js and uncomment the line // suite.addParameter('--main delayedAdd.Main'); to pull in the proper Main function, comment out any other that might be active.

Your Environment

• Version used:

  • haxeui-core@5f4a1feb
  • haxeui-kha@df552b0f

• Environment name and version (e.g. Chrome 39, node.js 5.4):

  • debug-html5 build

• Operating System and version (desktop or mobile):

  • Linux + Windows Desktop

• Link to your project:

  • https://github.com/sh-dave/haxeui-kha-testsuite

Expected Behavior

You can update / change the image resource to update the current image any number of times without encountering bugs.

Current Behavior

Sometimes creating an image with a RenderTarget based kha.Image you get graphical anomalies.

Possible Solution

Not necessarily a possible solution, but I made sure the Image provided to the image resource was not showing graphical issues by drawing it manually and it wasn't broken like the HaxeUI Image was.

Steps to Reproduce (for bugs)

1. Create an image component and add it to the screen
2. Create a kha render target and render images to it using g2.begin/end
3. Set the image component resource variant equal to the new image
4. repeat steps 2 and 3 a few times and you should see that there's an error

Media

Test app / minimal test case

Will create if the above information doesn't reveal the issue.

Context

Trying to have a section of the GUI display a small version of the map.

Your Environment

• Version used: Latest
• Environment name and version (e.g. Chrome 39, node.js 5.4): Kha debug mode (I believe Electron)
• Operating System and version (desktop or mobile): Windows 10
• Link to your project: I can invite you

Not sure if this is a bug or a enhancement. I have a table view on screen and I'm able to render on iOS but scrolling only works with the scroll bar.

Expected behavior would be that all scrolling can be done by touch and scrolling the list itself.

package;

import kha.Framebuffer;
import kha.System;
import kha.Assets;
import haxe.ui.core.Screen;
import haxe.ui.Toolkit;
import haxe.ui.components.Button;
import haxe.ui.containers.VBox;
import haxe.ui.containers.ListView;

class Project {
    private var _main:VBox;

    public function new() {
        Assets.loadEverything(loadedEverything);
    }

    public function loadedEverything() {
        Toolkit.init();

        _main = new VBox();
        _main.percentWidth = 100;
        _main.percentHeight = 100;

        var button:Button = new Button();
        button.text = "Hello";
        button.width = 100;
        button.height = 50;
        _main.addComponent(button);

        var tableView:ListView = new ListView();
        tableView.percentHeight = 100;
        tableView.percentWidth = 100;

        for (a in 0...500) {
      tableView.dataSource.add({label: "Item " + (a + 1)});
    }

        _main.addComponent(tableView);

        Screen.instance.addComponent(_main);

        System.notifyOnRender(render);
    }


    function render(framebuffer: Framebuffer): Void {   
        var g = framebuffer.g2;
        g.begin(true, 0xffffff);

        Screen.instance.renderTo(g);

        g.end();

    }
}

Whenever the app window is resized, the components within it are not rendered correctly and they appear differently based on the size of the window.
It is enough to resize the window vertically, the horizontal size doesn't seem to affect the UI.

Expected Behavior

They components should be always rendered in the same way

Current Behavior

The components are rendered in a few different ways during the window resize, one of them seems to be the "correct" one.

Possible Solution

N/A
I've tried using Toolkit.autoScale=false before Toolkit.init(), but it didn't help

Steps to Reproduce (for bugs)

1. Start the example app on MacOS Catalina
2. Resize the window

Media

From the gist below
From a more complex test (animated)

Test app / minimal test case

Gist

main.xml

<?xml version="1.0" encoding="utf-8"?>
<hbox id="main" width="100%" height="100%" style="background-color: white;padding:10px">
    <button id="testButton1" text="Click Me!"/>
    <button id="testButton2" text="Click Me!" />
</hbox>

Main.hx

package;

import kha.Assets;
import kha.System;
import kha.Framebuffer;
import haxe.ui.Toolkit;
import haxe.ui.components.Button;
import haxe.ui.core.Component;
import haxe.ui.core.Screen;
import haxe.ui.macros.ComponentMacros;

class Main {
	public static function main() {
		System.start({title: "HaxeUIApp", width: 400, height: 300}, function(Window) {
			new App();
		});
	}
}

class App {
	private var _main:Component;

	public function new() {
		Assets.loadEverything(onAssetsLoaded);
	}

	function onAssetsLoaded() {
		Toolkit.init();
		Screen.instance.addComponent(ComponentMacros.buildComponent("../assets/main.xml"));
		System.notifyOnFrames(render);
	}

	function render(framebuffers:Array<Framebuffer>):Void {
		for (framebuffer in framebuffers) {
			var g = framebuffer.g2;
			g.begin(true, 0x000000);
			Screen.instance.renderTo(g);
			g.end();
		}
	}
}

Context

When affected by the bug, the UI is unusable for any non-test application

Your Environment

• Version used:
  • haxeui-kha: 1.0.5
  • haxeui-core: 1.0.25
• Environment name and version (e.g. Chrome 39, node.js 5.4):
  • I don't know which versions Kha:HTML5 is using
• Operating System and version (desktop or mobile):
  • Desktop MacOS Catalina
• Link to your project:

Kha now compiles successfully to windows, however, when using a scrollview the content isnt clipped as is should be. This happens on html5 also.

Expected Behavior

The contents of the ScrollView should be successfully clipped to the parents size (this used to work)

Possible Solution

Ask Rob. :)

Media

Windows (cpp):

Html5:

Test app / minimal test case

            var scrollview:ScrollView = new ScrollView();
            scrollview.width = 100;
            scrollview.height = 100;
            for (a in 0...20) {
                var button = new Button();
                button.text = "Button " + a;
                scrollview.addComponent(button);
            }
            Screen.instance.addComponent(scrollview);

Your Environment

Latest Kha (git)
Latest HaxeUI (git)
Haxe 3.2.1

I tried to use a own font for a button using css and xml and there is no text.

Expected Behavior

Create a style and add the tag: font:"Fontname";
Use the style within the button in the xml. The button should show the text with the font.

Current Behavior

There is no text. But it's working in HTML5

Possible Solution

Sorry no idea right now.

Steps to Reproduce (for bugs)

1. Use skeleton example from https://github.com/haxeui/haxeui-templates.
2. Add a own font in ttf or use the arial.ttf from the template
3. change the main.css to
   .big-button {
   font-size: 30px;
   font: "arial";
   width: 250px;
   }
4. compile to windows

Media

Windows build

HTML5

Test app / minimal test case

Use skeleton Template

Context

Cannot use any font on windows target. This is bad for games if i can only use the "standard" font.

Your Environment

• Version used: git version of haxeui-core and haxeui-kha, git version of kha
• Environment name and version (e.g. Chrome 39, node.js 5.4): Windows 10
• Operating System and version (desktop or mobile): desktop

I have created a test app. Basically it comes in 2 parts login and create account. They're very similar. I have also attached a GIF of what happens. Currently, textfields may lag on input (as demonstrated twice in the gif on the password fields - but I've gotten regular textfields doing the same thing before). Then if you notice, I'm typing on the login page but the textfields from the create account page are the ones receiving the text.

The third problem is most obvious. If you click the login button I removed the whole component from the screen. If you start typing any letters or left/right arrows the textfields are apparently still hooked and throw an exception - you must be debugging and catching uncaught exceptions to see this error.

The fourth problem, not displayed, is that if you keep pressing backspace in an empty textfield you essentially break its positional information. Once you've pressed backspace enough times, try entering in some text - it will all be entered at the front of the character list instead of the back like normal. Using the arrows to correct it does not work.

So that's 4 problems
1: text field lag (slightly inconsistent).
2: selecting text fields in other tab view pages (fairly consistent).
3: text field events remain registered when their parents are removed from the tree. (consistent)
4: Pressing backspace repeatedly breaks typing in the text fields. (consistent)

Media

Test app / minimal test case

Attached is a similar test app to my last issue but with more haxeui components.
testapp.zip

Context

Unresponsive/broken text fields make for an unpleasant user experience.

Your Environment

• Version used: latest
• Environment name and version (e.g. Chrome 39, node.js 5.4): Chrome Debugger
• Operating System and version (desktop or mobile): Windows 10

Expected Behavior

When doing background-image-repeat: repeat; or background-image-repeat: 'repeat'; in the css style, the background image should repeat.

Current Behavior

Is not implemented and just hides the image

Steps to Reproduce (for bugs)

Say we have a grid.png in our project Assets folder.

    <grid id="grid1" columns="2" style="background-image: 'grid'; background-image-repeat: repeat;">

    <grid/>

Context

Have a visual representation of the rows/columns of my grid

Your Environment

haxeui-core and haxui-kha git new-component-method

Setting scrollmode to “drag” or “inertial” seems to have no effect on a scrollview or list if you press and drag on the actual content, say for instance a label in a list. Dragging in a list outside of an actual content element and it will work like its supposed to.

Expected Behavior

simple application with one button

Current Behavior

blank screen

Test app / minimal test case

KhaApplication.hx

import kha.System;
import kha.Assets;
import kha.Framebuffer;

import haxe.ui.Toolkit;
import haxe.ui.core.Screen;
import haxe.ui.components.Button;
import haxe.ui.macros.ComponentMacros;

class KhaApplication {
	public function new () {
		Toolkit.init();
		
		Assets.loadEverything(function() {
			var button:Button = new Button();
			
			button.top  = 10;
			button.left = 10;
			button.text = "Click Me";
			
			Screen.instance.addComponent(button);
		});

		System.notifyOnRender(render);
	}
	
	function render (framebuffer:Framebuffer) : Void {
		framebuffer.g2.begin(true, 0xFFFFFF);
		Screen.instance.renderTo(framebuffer.g2);
		framebuffer.g2.end();
	}
}

TestKhaHaxeuiProject_Button.zip

Your Environment

Linux Mint 18.1 x64
haxe 3.4.0
haxeui-core from git
haxeui-kha from git
Kha from git

Thanks.

Hi. Why I can't see text of the button (with default styling)?

Expected Behavior

Result Window:

if the flag "Breakpoint on All Exceptions" is checked (KodeStudio), then my application will be stopped:

Test app / minimal test case

SampleProject.zip
Source of KhaApplication.hx:

package;

import kha.System;
import kha.Framebuffer;

import haxe.ui.Toolkit;
import haxe.ui.core.Screen;
import haxe.ui.components.Button;
import haxe.ui.macros.ComponentMacros;

class KhaApplication {
	public function new () {
		Toolkit.init();
		
		var button:Button = new Button();
		
		button.top  = 10;
		button.left = 10;
		button.text = "Click Me";
		
		Screen.instance.addComponent(button);

		System.notifyOnRender(render);
	}
	
	function render (framebuffer:Framebuffer) : Void {
		framebuffer.g2.begin(true, 0xFFFFFF);
		Screen.instance.renderTo(framebuffer.g2);
		framebuffer.g2.end();
	}
}

Your Environment

• haxe 3.4.0
• haxeui-core from git
• haxeui-kha from git
• KodeStudio and Kha from git

Thanks.

Hi!
i m having errors on project launch ,

Current Behavior

errors

Context

i have followed this video

Your Environment

kcode studio 16.11.0

DropDowns mostly ignore clicks on the list of values. Sometimes it works but very rarely, couldn't figure out the exact circumstances. Tried to figure out what's going on but UI code is just way too complicated for me. Happens in a project I can not share but if you can't reproduce I'll try to condense it down into a proper sample project.

Expected Behavior

If we put a percentage value in css prop height/width in the style="" the height/width should be set to the percentage value and not just null out

Current Behavior

When putting a height/width with a percentage(100%) value in the css style="" it creates a width or height of zero(or null)

Possible Solution

In the meantime users can use width="100%"

Steps to Reproduce (for bugs)

In main.xml

<vbox width="100%" style="height: 100%;" >
    <box id="I will not appear because vbox height is ill defined">
    <box/>
<vbox/>

Your Environment

haxeui-core and haxui-kha git new-component-method

(This question just for a discussion)

Hi. I noticed how much the increased RAM consumption when I try to render some text.

For example, this application will consume ~30 mb RAM:

package;

import kha.System;
import kha.Assets;
import kha.Framebuffer;

import haxe.ui.Toolkit;
import haxe.ui.core.Screen;
import haxe.ui.components.Button;
import haxe.ui.macros.ComponentMacros;

class KhaApplication {
	public function new () {
		Toolkit.init();
		
		Assets.loadEverything(function() {
			var button:Button = new Button();
			
			button.top  = 10;
			button.left = 10;
			//button.text = "Click Me";
			
			Screen.instance.addComponent(button);
		});

		System.notifyOnRender(render);
	}
	
	function render (framebuffer:Framebuffer) : Void {
		framebuffer.g2.begin(true, 0xFFFFFF);
		Screen.instance.renderTo(framebuffer.g2);
		framebuffer.g2.end();
	}
}

but if uncomment line //button.text = "Click Me";, then the result application with consume ~60mb RAM (and increases with the complication of UI). Operation to display title for button "Click Me" will give additionally +30mb RAM.

TestKhaHaxeuiProject_Button.zip

What do you think, is this normal count of RAM for a text rendering?
Thanks.

Was caught by Class<kha.Image> has no field fromEncodedBytes

But since fromEncodedBytes does exist in Kore, I think Krom should also expose the method

cc @RobDangerous

Expected Behavior

Can't compile Kha-Sample for Linux. It's failed with error:
/home/username/.haxelib_repo/haxeui-kha/git/haxe/ui/backend/ComponentBase.hx:13: characters 7-20 : You cannot access the js package while targeting cpp (for js.html.Image)

I'm tried to compile this sample with KodeStudio (F5 -> Compile Kha Project -> Linux).

Your Environment

• haxeui-core from git
• haxeui-kha from git
• haxe 3.4.0
• hxcpp 3.4.49
• kha 16.1.2
• Linux Mint 18.1 x64

Thanks.

Expected Behavior

Negative values should behave as positive values do.

• The slider indicator should go into the negative side of the slider.
• The slider filled region should correctly go 'backwards'

Current Behavior

• The slider moves with the mouse, until reaching 0, where it stops.
• The filled region does not go into the negative half

Steps to Reproduce (for bugs)

Create a slider and set it's min to -100 and max to 100 - move the slider.

Media

Test app / minimal test case

slider.min = -200;
slider.max = 200;

Context

Trying to build sliders that move with the coordinates of a cartesian point.

Your Environment

HTML5 build on a linux system.