codename one - no way to set background image in list - list

I am new to codename one and I have tried for one and half day to fix my issue of,
a list with background image in each row.
Let me explain, I am having a list with some items(entries), I created renderer and name it appropriately. I set background correctly which is reflecting in designer (see image)
but when I run it on simulator/device , all formatting and designs are just invisible..!! (see red arrow pointing to simulator in image)
anyone have any idea ? why this is happening ?
Thanks,
Akash

It seems you didn't set the background correctly in the designer. Since the list items in the model within the designer are strings the renderer entries don't get overriden and so you see a separate UI.
To reproduce the issue in the designer click the items entry in the list property, remove everything and add a sample key/value hashtable pair. You would see all your design entries disappearing.
This might help you understand how to customize images and backgrounds here: http://www.codenameone.com/3/post/2013/12/deeper-in-the-renderer.html

Related

How to move list item given source index and destination index with animation in flutter

I am building a leaderboard screen in the flutter application, whenever the user comes to the leaderboard screen, I want to show the animation of his old position to a new position in the leaderboard, so I need an animation of this row to go up or down based on his standings, please someone help me which widget to use to get this functionality working. Thanks
AnimatedList is the widget you are looking for. It automatically generates entrance and exit animation when items are added/deleted. Combined that with SizeTransition, and you will get a nice "growing/shrinking" effect.
There are some really good examples (and even a video tutorial) on the official docs as well.
You can also look at this answer for a more complex example of using 2 of them.

Change the order of ColumnLayout or ListView and save / restore it

I'm working on a stream overlay that extracts information out of a game (flight simulator) and displays it on the screen. Right now I'm using Qt in conjunction with a *.html to render the overlay. It is all working really well, however I wanted to add some customization options for the users of my overlay software and I figured the best way would be to render the Overlay in QML.
The main part of the overlay is a row that contains around 8 "elements" that display the relevant data.
One thing that should be customized is the order of the elements in the row. But I really have no idea how to implement this feature. I've seen a few posts and tutorials on how to customize the order in a View using the DelegateModel. However right now it's not a view but QML Components inserted in a RowLayout due to the fact that they are all different components (e.g. some of the images are actually animated for which I'm using a component that uses Canvas2D to draw the images). I guess I could figure out a way to store those elements in a model using the Loader Component to display the content in QML. But even then I'm not entirely sure how to store and restore the order of the elements. As far as I can tell the DelegateModel only changes the View and not the underlying model.
Any suggestion or best practice to accomplish my goal would be highly appreciated.

Issue related to draggable content in famo.us

I have small application in famo.us framework. There are 5 images. I want drag images. requirement is like when i drag firstImage, second image should be visible behind the first image. i tried to show second image on dragging up of firstImage, but it hides firstimage.
so is it possible to show second image behind the first image ??
Thanks
Check the z position of your images. Chances are you're encountering z-fighting, where two elements exist on the same position on the same z-axis. Try changing the z-index of the images to different values first to see if that fixes it.
Otherwise, check the 3d-transform you've supplied to famous to make sure your images aren't resting on the same z-value.

How to determine the content step value of scrollarea

I'm making my own UI from scratch using OpenGL that is why I'm asking this and please don't make any discouragement as this is just a hobby project.
Currently, I'm stuck implementing how this scrollbars really work. In my current implementation, the content scrolls at the wrong step value as well as the thumb, meaning, I set the value manually like 1px step for each of them.
The structure of my scrollbar implementation is describe as follows:
I draw scrollbars i.e the main rectangle where the 3 button lies.
Those 3 buttons are, thumb, buttonBack and buttonNext.
All of them do the basic logic of scrollbars i.e when I click each one of them, they moved. But the whole part(scrollbar) don't know how to scroll contents
So what I did is: I make another object and I call it scrollarea
It has two scrollbars, vertical and horizontal scrollbar.
I made a function called scrollToX and scrollToY which
does what I named to them.
But the step values I set to them are
manually set up.
I try to google some scrollbar, scrollarea, scrollview or whatever you call to that scrollable rectangle thing, but all I see are implementation and I cannot find any guides how to build your own. I have no choice but to look at their implementation. I try my best to comprehend what they did but their implementation of how their whole UI structure is very different to mine, and I cannot find anything useful there.
So I ask again here if anybody can explain me well how to make a properly functional scrollbar.
Most specific things I'm really concerned of are:
How do I determine the thumb step value?
How do I determine the content step value?
All of these depend on your content -
Is it just an image ? If so, you only need to change the offset depending on the size of the image.
Is it a list of values like in Windows explorer ? Then you need to create a data structure first that contains all of it, and shows the content that fits within the window as it scrolls.
OpenGL does not fit into this discussion.

Infragistics UltraGrid rows displayed from bottom to top

I need to display rows in UltraGrid starting from bottom and going towards the top rather then normally where they are displayed from the top to the bottom.
Is there a setting of a property that needs to be set to achieve this display? I can't seem to find it.
Example of required layout
This functionality isn't built into the WinGrid control and you should log a new product idea on the NetAdvantage for Windows Forms product idea page for this if you are looking for this functionality.
You may be able to do something like this using a creation filter to move the existing rows if there are not enough rows to fill the grid. If you do pursue this you would still need to sort the rows so that they are already in the correct order first and they you would move the existing rows down when they don't fill the entire grid. There are more details on creation filters in the help.