ListView performance with complex views as list items - android

I had ran into problem with performance. I have to develop complex ui based on ListView and really complex item layout contained nested layouts, custom views, lot of images etc.
The problem is as usual, when client is creative and has no limit credit card: performance.
Creating of list view lasts ~10 seconds on fast device.
When I profiled application, I discovered, that most of the CPU power is used for onMeasure method - you know how it works - measuring of the width, passing measure demand to children, getting them into lauouts, asking layouts to change it's height, then measure once again with new bounds - horror.
I can't show you the screen with the layout - just say that there is ~80 views in each item - no we can't do less.
My idea is based on simple observation - every single one sub view on particular device has this same size - i.e. if I have an image view to display inside the list item - on each item it will have exactly this same size.
So I want to make some cache for dimensions - i.e. - I have LinearLayout containing bunch of views, I want to perform simple algorithm:
Create CustomLayuout extending LineraLayout
put members like width, height (i.e. static)
when view is created for a first time I want to get it's size put it into static vars and reuse them when next instance of the view will be created.
After this (a bit long) description finally my questions:
Can I apply approach like that, or there are some serious
disadvantages?
How to do it (code sniplets welcomed)?
Thank you in advance

Related

What will be the difference between adding the view programmatically vs using recyclerView?

There is a canvas and As a beginner, I have learned about viewGroup in android and how to add a view or multiple views in a viewGroup using either xml or programmatically using addView. We can add as many view we want to add and we can also increase the height of the view dynamically using layoutParams. While we can use addView or setLayoutParams to increase the height of the canvas as we add more pages, why should we use recyclerView?
From the UI perspective, everything seems equal here whether we say increasing height or adding view or list of items. Even though when we are increasing the height, there is a separator between each addition. However, the separator is not a major concern here. Basically, based on numbers of pages or items or data, we are increasing the height of the canvas view so that we can include and show all the data. These numbers of pages has been set to 14 currently but it can be increased without any limit and each canvas board can contain an unpredictable amount of data - may be hundreds of dots, a combination of lines, shapes, text, images and so on - which is fair. We are not limiting user to draw only certain amount of things on individual canvas board.
While we can use addView or setLayoutParams to increase the height of
the canvas as we add more pages, why should we use recyclerView?
Because RecyclerView is more efficient for large sets of data.
From the UI perspective, everything seems equal here whether we say
increasing height or adding view or list of items.
No, it's not. If you add a 1000 items to a ViewGroup it will try to draw 1000 items, dragging your app to a crawl at best, or crashing at worst.
If you add 1000 items to a RecyclerView it will draw however many will fit on screen.
These numbers of pages has been set to 14 currently but it can be increased without any limit
Untrue. There is always a limit. It maybe large, but there are always limits. In this case, the limits are on RAM (how much data can the device hold in memory before it craps out).
RecyclerView is a powerful tool to efficiently display large sets of data with so many abilities such as caching and show items with animation.
Using RecylcedrThere is nothing to compare between RecyclerView and addView() cause their usage is different.
However i recommend you to read this article about how does RecyclerView Works.
How Does RecyclerView Works

Positioning views in Horizontal Scroll View

I'm trying to build a point-and-click adventure for Android without using any pre-written engine, but I'm stuck in a really crucial point!
I have a HorizontalScrollView bigger than the screen, so the user can scroll left and right in portrait mode to search around rooms, now what I need is to insert items that the player can use inside this View.
I'm trying to use static ImageView, but I'm really confused on how to insert Views in an absolute position inside the HorizontalScrollView. All I know is that Android manages Views location relative to other views (align on top, next to, bottom of), but what I use if I need to position a View in a specified position using specific coordinates without worrying that the image will be misplaced in a different screen size for other Android devices?
I really am confused on how position views in Android :/
Consider creating your own view instead of abusing HSV.
Custom views, doDraw() method, canvas and even gesture detection is not that hard.
Here is a link that will help you with basics, simple viewport implementation for android with scrolling via key events: http://sonnygill.net/android/android-viewport/
what I use if I need to position a View in a specified position using specific coordinates without worrying that the image will be misplaced in a different screen size for other Android devices
Actually, that's exactly the reason ViewGroup (layouts) were created.
You should choose the right layout based on your requirements.
If you do want to position the views by yourself, you can create your own custom ViewGroup by extending one of the view group classes and override the onLayout(...) and onMeasure(...) methods which are used to position and measure child views (in you case, probably the ImageViews) respectively.
You can use this example of FlowLayout as a reference on how you can write your own custom ViewGroup.
Please note that if your content is bigger than the screen as you mentioned, the HorizontalScrollView should be a parent of a single child (which should be the ViewGroup containing your images).

Android - More than 80 views - How to increase performance

My activity currently has more than 80 views and now I´m getting the error, that this is (obviously) bad for performance. So, what can I do to increase the performance?
Is it possible to only load the views that are visible on the screen?
These are the views i´ve to repeat over and over again:
http://i.imgur.com/Opc1KEA.png
There's no way you're fitting 80 of those on your screen, so as you mentioned, you only want to load the views that are visible on the screen. You need to implement an Adapter. Depending on your layout that might possibly be in conjunction with a GridView, but almost certainly some sort of layout that subclasses AdapterView.

How is the number of views limited?

I want to figure out the main effectivity issues of the Android layouts and views. I'm doing a research now but maybe somebody has answers already.
I have a RelativeLayout that is populated with views dynamically. Basically, the application loads a forum thread in XML and then renders the discussion tree so each message is displayed in its own group of views. I've decided not to use WebView because I want to implement some client-side functions that should be easier to do on custom views than on HTML page.
However this approach has a major flaw: it's heavy.
The first problem (which I've solved) was nesting of views. This is not an issue now, my layout is almost flat so the maximum depth is 10-12 (counting from the very top PhoneWindow$DecorView, the actual depth depends on data).
Now I've reached the next limit that is somehow connected to (or caused by) resource consumption of the views. After loading the data, the application hangs for a while to build the layout (creates the views and populates them with the data), and the hang time seems to grow linear with the data size; and if the data is large enough, the view will never appear (eventually the system suggests closing the application because it isn't responding).
Now the questions:
Does memory consumption depend significantly on the view class? In other words, is there any major difference between a Button and a TextView, or an ImageView? I can attach a click handler to any view so they don't differ much in usage.
Do background images affect the performance? If the same image is set in N views, will it make the layout N times heavier? (I understand that this question may look silly but anyway.)
Are nine-patch images significantly heavier than regular ones? What is better: to create N views where each has some background images, or to make one view that is N times wider and has a repeating background?
Given some layouts, what should be optimized first: overall number of views, nesting levels, or something else?
The most interesting. Is that possible to measure or at least estimate the resources consumed by the activity and its views? If I make some change, how could I see that I'm going the right way?
UPDATE
Thanks to User117, some questions that I asked above are now answered. I've used the Hierarchy Viewer and optimized my layout: compared to what I had before, the overall number of views is now reduced almost twice, and the nesting is also reduced.
However the application still hangs on a large forum thread.
UPDATE 2
I've connected the debugger to my device and found that the application gets out of memory.
But what is very unexpected for me is that the error occurs after I populate the layout. The sequence is as follows:
All my views are added. I can see a slight slow down as they are being added.
Almost nothing happens for a couple of seconds. During that time, a few info messages are spawned in the log, they are identical: [global] Loaded time zone names for en_US in XXXXms, the only difference is number of milliseconds.
The out of memory error message is spawned: [dalvikvm-heap] Out of memory on a N-byte allocation (the actual size varies). The long error reporting starts.
What does this mean? Looks like the rendering have its own demands that may be considerable.
UPDATE 3
At last I've found the core issue. Here is a screenshot from my application, see an explanation below the image.
Each message consists of a round button that shows or hides the replies and a red content frame to the right of the button. This is very simple and requires only 6 views including the layouts.
The problem is the indentation with these connection lines that show which message is related to which.
In my current implementation, the indentation is built of small ImageView's, each containing a square image that shows either empty space, or a vertical line, or a T-like connector, or a L-like corner. All these views are aligned to each other within the large RelativeLayout that holds the whole discussion tree.
This works fine for small and medium trees (up to few hundreds of messages), but when I try to load a large tree (2K+ messages), I get the result explained in UPDATE 2 above.
Obviously, I have two problems here. I spawn large number of views that all consume memory, and these views are ImageView's that require more memory for rendering because they render a bitmap and therefore create graphics caches (according to explanation given by User117 in the comments).
I tried disabling loading the images into the indentation views but got no effect. It seems like adding that huge number of views is quite enough to eat all available memory.
My other idea was to create an indentation image for each message that would contain all pipes and corners, so each message would have the only indentation view instead of 10 or 20. But this is even more consuming: I've got out of memory in the middle of populating the layout. (I cached the images in a map so two bitmaps with identical sequence of images weren't created, that didn't help.)
So I'm coming to conclusion that I'm in a dead end. Is it ever possible to draw all these lines at once?
Different View's are different kinds of Object. Some only draw() light weight stuff, some can hold large Bitmap Objects, and handler Objects and so on. So, yes different View's will consume different amount of RAM.
If same Bitmap object is shared among views, There's only one Object in RAM, each View will have a reference variable pointing to that object. But, not so when View draws: Drawing same Bitmap n times at n places on screen will consume n times CPU and generate n different bitmap_cache for each View.
Each side of a 9-patch image is actually bigger by 2 pixels from the original image. They are not much different as a file. When they are drawn, both can be scaled and will take almost equal space. The only difference is that 9-Patch are scaled differently.
Setting the background of the larger, parent view is better when the child views are transparent, and background will show through.
You can save a small image and set a tiled background so that it can fill a large area.
Nesting is to be optimized first, because all of the views might not be visible at a given time, let's say only a few views are visible in scrolling layout. Then you can cut down on total number of views used. Take cues from ListView: Given that user will be only seeing a sub set of total data at a time, it re-cycles the views. and saves a lot of resources.
SDK provides Hierarchy Viewer tool for this purpose. It shows a full tree structure of a running Layout, also places red flags for the sluggish parts of the layout.
A good layout is that which:
Easy to be measured (avoid complex weighted widths, heights and alignments). For
example instead of doing layout_gravity="left" for each each child, parent can have gravity="left".
Has less depth, each overlapping view adds another layer to be composited while screen is drawn. Each nested View Structure, asks for a chained layout call.
Is smart and re-cycles Views rather than create all of them.
Reuses its parts: tags like <merge> and <include>.
Update:
Answers to this question, show many approaches for a tree view in android.

Need to create spreadsheet like control, what should I extend ListView or GridView?

I am an experienced developer, but I'm inexperienced on the Android platform. So I am seeking some advice from developers with more experience with Android.
I am building a Honeycomb application using Fragments. One of the fragments calls for a vertically scroll-able read-only "HTML table-like" view with dynamically loaded data. Similar to a spreadsheet, I should have clickable headers which I can implement server-side requests to filter/sort the data.
I am pretty sure this Control doesn't exist yet, am I right? Do I have to build it?
Assuming I have to build it, which existing widget should I extend? ListView, Table, GridView?
I assume I would have one widget for the header, and then wrap the body of the table in a scrollable layout to handle scrolling while keeping the header visible. I am concerned that I might not be able to guarantee that the headers line up with the columns.
Thanks in advance,
Tim
Android layouts are pretty basic - there are not any shipped layouts that will really do what you are looking for automatically, but you could probably do what you want with a heavily controlled gridView. Android is also pretty bad about controlling multiple elements to fit within the screen size, as it's goal is to support multiple screen sizes and densities.
From what I understand your desire to be, I think the best solution is to create a nx2 grid view dynamically, and control the width of the view based on the device size. You would have n number of headers on the top, and you could fill the lower half of the grid with your textViews, or whatever data you wanted. The hard part would be keeping the widths of the grid elements under control and on the screen. In addition, you will probably find that you can only fit a small number of header items on the screen because of the phone's small size, so you may discover a better layout to fit your needs.

Categories

Resources