Thank for the advice.
One other question : I’m using your example , as a base, and tried to make the background transparent. Fot that I set the background color and the border ( on the listview ) to none, but that doesn’t help.
Here is the result with loaded image for even /odd rows ( ignore the height) :
I’m expection transaparent boxes like this one:
Is this a bug for box in a box ( vbox/hbox) , or I’ve done something wrong ?
Its hard to know without seeing some code / xml. What is the difference (in source) between the 2nd and the 1st image as the second one seems to be working fine right? Which indicates it might not be bug.
The first one use your example code with custom item render and custom VBox / HBox components.
In the second one use default ItemRenderer and default VBox / HBox.
My understanding was that everything should be the same, but the result is different.
I think you can try to add border and background color to none in your example above and you will receive same result as mine.
Sorry Ian.
The problem was in my ItemRender class I do
backgroundColor = "none";
borderColor = "none";
which lead to black background . It’s my mistake sorry.
Is it possible to set no backround and border directly in the code similiar to css code ?
background-color: none;
border: none;
As I mention backgroundColor = “none”; lead to black background, not transparent
ok, nice… i think backgroundColor = null might be what you are after. That said, if its easy (ill have to check), it’d would be nice for “none” to also work.
One other question. For balance and count component I load images asynchronously.
For that reason I keep them in Map and after loading each image I set it with bitmapdata like this limage.resource = bd; , but the image is not show.
Do I need to update the Image component after setting the resource property ( how ?) ?
Do I need to update the Image component after setting the resource property
You shouldnt need to, no. Are you sure the images are valid? How are you loading them? I mean, http or something?
Yes , it’s a valid image ( png) . I’m using Assets.loadBitmapData ( openfl html5 target) which load images from assets folder ( not embeded ) ( “img/icons/vipUIcn.png”) , where in project.xml <assets path="assets/img" rename="img" embed="false"/>
I do something like this :
var imageQueue:Map<String,Array<Image>>;
......
......
private function startLoadImage(imageName:String, cImage:Image):Void
{
....
imageQueue[imageName].push(cImage);
.....
Assets.loadBitmapData(imgPath,useCache)
.onComplete(function(bd) {
.....
.....
var images = imageQueue[imageName];
var limage:Image = images.pop();
trace("Image loaded : "+imageName+" - "+bd);
limage.resource = bd;
.....
}
}
I trace before image.resource = bd; and it give correct data on HTML5
Bitmap data below:
Image loaded : noVipIcon - {
__drawableType : 0,
transparent : true,
width : 28,
height : 27,
rect : (x=0, y=0, width=28, height=27),
__textureWidth : 28,
__textureHeight : 27,
__renderTransform : matrix(1, 0, 0, 1, 0, 0),
__worldAlpha : 1,
__worldTransform : matrix(1, 0, 0, 1, 0, 0),
__worldColorTransform : (redMultiplier=1, greenMultiplier=1, blueMultiplier=1, alphaMultiplier=1, redOffset=0, greenOffset=0, blueOffset=0, alphaOffset=0),
__renderable : true,
image : {
offsetX : 0,
offsetY : 0,
width : 28,
height : 27,
version : 0,
type : CANVAS,
buffer : {
data : null,
width : 28,
height : 27,
bitsPerPixel : 32,
format : 0,
premultiplied : false,
transparent : true,
__srcImage : [object HTMLImageElement]
}
},
readable : true,
__isValid : true
}
hmmm, very strange, you certainly dont need to invalidate the component or anything once you set its resources to a bitmapData, it should just happen automatically. Ill check it out
As a info , all images are part of similiar to your Balance component which is a part of custom item render in a list view.
Is there way to stretch the image used for backround image on the even/odd rows in thelist view ?
For example I have :
.common-list-image .even {
color: #ffffff;
background-color: none;
border: none;
background-image: lookup('common-list-even-image');
}
.common-list-image .odd {
color: #ffffff;
background-color: none;
border: none;
background-image: lookup('common-list-odd-image');
}
I tried to set background-size: 100%; but it doesn’t help
oh, background doesnt stretch by default? Ill have to check it out - background-size does sound like a nice addition anyway
Regarding the previous issue with setting the Image .resource, I had set visible = false.
Sorry for the false report.
I have an HBox with an image and label and there I set verticalAlign= "center"; , but the label is not center in the box. Example here ( hbox has a red border):
It’s similar if I have two images that should be close together, but both images have a large distance between them.
Wha am I missing ?
Here are the examples icons: https://drive.google.com/file/d/1v68CsFGv-i4bB4fEnrS7tamlEBVkRcze/view?usp=sharing
Is the verticalalign = center doesn’t work properly ?
It should be working fine - i use it all the time - ill have to check it out - but im super busy today, and on holiday from sat → mon, so it will have to wait.
Btw, there is a haxeui discord (well, haxeui channel in discord, its often easier to get quick responses to this type of stuff, but its up to you, forums work equally as well 
)
Thank you for your time! I’m not in hurry . I’m still trying to learn how to use HaxeUI properly .
Here is another example ( without image): Builder - HaxeUI or Builder - HaxeUI
Maybe I miss something simple.
About chats, I preffer forums, because it’s much more easier to find something than to dig in chat
Hi flashultra!
Here is the second version corrected. VerticalAlign applies to the component itself, not to the children.
http://haxeui.org/builder/?ukwybr
(For the first version I do the same thing , but it doesn’t seem to work lol)
Here is another tip, if you want to to layouts, you can also use spacers
For example
<hbox height="200" style="padding: 5px;border: 1px dashed #ff0000;" >
<vbox height="100%">
<spacer height="34%"/>
<label text="I'm at 2/3 :)"/>
<spacer height="66%"/>
</vbox>
</hbox>