How to load many (200-300) HTML pages in WebViews in background - android

I want to be able to swipe between many HTML pages without noticeable lag. To do this, I want to load all of the pages into separate WebViews either in the background after the app is loaded, or in onCreate(). I'm using the code here: Looking for Android ViewFlipper Example with Multiple WebViews but ran into errors trying to create WebViews in doInBackground(), something to do with needing to create WebViews in the main thread. So instead, I just created the WebViews in onCreate().
However, this example uses just three HTML pages. I want to load up to 300. What's the best way to do this other than hard-coding 300 WebView objects?

You should reconsider why you need to do this, it is never a good idea to cache this many objects into memory. Chances are the user will never move through all 300 pages during one session so you will have wasted resources loading many unnecessary WebViews.
If you need to load Webviews without lag you should look into using ViewPager. It is perfectly suited for your needs and the Android developer site has a tutorial for exactly what you are trying to accomplish here.
ViewPager even allows you to set how many pages it will cache at a time. If you need to preload pages you can use the setOffscreenPageLimit method to set how many pages should be loaded ahead of time.

You can load the HTML/DATA before you load it into the webview, so at least it doesn't have to go to the network to get the content
Also, you can set how far away from the current index the ViewPager will load

Related

Is webview better than recycler view in term's of scrolling content and display comparison?

I am beginner in android development with a good background in web development my question is web view better for viewing content multiple content from server since its the server site being loaded or is it best to load the resources and use recycle view to display content and in doing dose it perform well since it uses java code only to run the application
Performance is not directly comparable, loading a hello world on a Webview can be more performative than loading one million items with high res photo.
For the sake of your question, I will risk saying:
RecyclerView should always be the preferred choice, not because is completely working on the platform language, but because the RecyclerView has been improved to be performant.
The RecyclerView use a RecyclerView.Adapter to create a list. The inner working of it literally recycles the rows from a View pool (hence the naming). This means, that the memory will only hold the enough views to fit the UI needs.
Inside the adapter, there are 2 methods: one for the creation and one for combining the row view with the data at that index. The creation is only executed if it is needed, but the combination of the data with the layout is always executed. You can confirm that by adding a log on each.
That been explained, it could be a deeper confusion. Getting data for the WebView and for the RecyclerView.Adapter are two completely different approaches:
For the WebView simply pass a String containing an url.
For the adapter, the preferred method is an HTTP request to an API REST.
To be honest you can't compare these two even a bit. They are both made for completely different use cases:
WebView should display some web content provided by a web server or some locally stored html files. The performance you are asking for is highly dependent on the actual data you want to display. In addition the whole look and feel (UI/UX of the actual displayed content) has to be implemented in html/js etc.
RecyclerView was designed with the aim to display big sets of data (since a simple ListView was not flexible and performant enough). It does not define the actual way the data is displayed (you can use different LayoutManagers or even define your own). The main idea is to load the data from an Adapter that really has to be displayed now (with a bit of buffer before and behind currently visible area on the screen).
Conclusion: you can't compare them, especially in terms of performance since they both do absolutely different things. If you have your data as web content (html files, website etc.) then simply use a WebView. If you have a large set of data (from whatever source) and want to display this data in a way the app is staying smooth and responsive (especially scrolling), take RecyclerView.

create a image gallery that cache and download images from the web with odd swipe action

I'm new to android development and I want to create a navigation concept which is a little weird for android and not sure what is the best way to develop this.
In a nutshell the application hold an endless collection of images downloaded from the server as the collection processed with buffering to make it smoother.
The general Idea is that I see the image full screen and have the ability to either swipe left or right, each direction represent a different action on the image and will show a small image near the image during the swipe to indicate which action I selected. Afterwards regardless on which action I selected it will swipe to the next image in the collection.
What would be the best direction to solve this problem, PagerAdapte or FragmentStatePagerAdapter (since I don’t have the ability to navigate back to an image)? Manually implementing the swipe using listeners?
Also how do I deal with showing the small images without making the code too awkward?
Should I use Volley for the image downloading?
Your answer is Bitmapfun. Try implement it. First screen of this application is gridview. If you click one of those items those images are shown in ViewPager you have to implement the ViewPager section. It also cached those images as you mentioned in your question.
Github link
Here is my solution to your problem:
First use volley to download images because:
1- Volley is open source and you can easily configure it, the concept behind it is very simple.
(for example you can change cache size, thread pool size for network requests and so on)
2- Volley uses two level caches, so makes you feel free about memory and …
3- Volley decodes images for you on the worker thread and that’s another problem you may face it but Volley solves it for you.
4- Volley handle configuration changes so on the flight requests dose not duplicate if orientation changes and you request them again(for the first section)
5- You can ask volley to deliver you an image in a different sizes so your thumbnail image and real image all can be delivered with just changing the request image size
6- You can change the HttpStack of it to run on a OKHttp , which is more optimized for all version down to I think 2.2
All you need to do is just spend some time to understand it and configure it to get most performance from it and use it’s two level caches to show your slides.
For showing the images I do not recommend you any of FragmentPagerAdapter nor FragmentStatePagerAdapter because:
FragmentPagerAdapter is not suitable for large collection of fragments because it store all fragments in memory and you will soon get OOM exception.
FragmentStatePagerAdapter is good because it handles configuration changes but it also stores at minimum 3 pages in memory which one of them is the last page you just visited so because you do not want to go back to last image it wastes memory for you.
I think best solution is manually implementing the swipe using listeners with the idea of off screen loading, to load for example two next images in memory.
Have you tried AndroidImageSlider. It is open source and has some pretty awesome features.
you can refere this " https://github.com/Dreddik/AndroidTouchGallery " link hope it`ll helps u :)

pre-load a webview on android so user doesn't have to wait for the slow loading time

I'm making an app where the main content that te user wants to view is in the form of html pages, I'm actually porting an app over from iphone and want to reuse the pages because there are 100 of them and recreating them as android layouts would be quite time consuming. The problem is that on android the webview takes about 4-5 seconds to load the first time I open a page and a couple seconds each subsequent time.
I searched and found a similar answer but don't know if it will work for my situation(preload webview). This answer suggests using a viewflipper with multiple webviews already loaded so when you switch between them it is instantly loaded. I don't know if that will work for me because I have 100 different pages to cache(Although I could optimize it down to about 30 max by only loading ones the user can navigate to from their current page) and because the webviews are in a different activity than the button the user clicks to view the page. i.e the user is looking at a listview with about 30 different options for pages to view, when they click a listview entry it opens the activity with the webview and I would have to wait until the user made that click to begin loading the webviews, so theres no way to shave off any loading time there.
I suppose since the listview and webview activities are the same, just a small view for the title then either the webview or the list underneath of it, I could consolidate into one activity and have the listview as well as all the webviews in the view flipper and the only thing I would lose is the transition between the listview activity and the webview one, which is not a big deal. Would this solution work? Should I really just cache up to 30 webview pages? I don't think this is a viable solution and I want to ask if anyone who is better than me with android programming has a better solution. If I could preload just one page that would be enough, although not optimal, because it only takes a couple seconds to load the 2nd 3rd 4th etc... pages.
tl:dr - webview takes 5 seconds to load the first page and a couple for each one after that. I wan't to make it instant but if that isn't possible i want to at least preload the first one(idk which html page to load until the user actually clicks an option btw, and there are 100 different options) so it doesn't take 5 seconds. Right now I'm looking at finding a way to preload/cache up to 30 pages so all the users options are already loaded but that might use to much memory. Also considering finding a way to open the activity in the background and load the webview with whatever page, doesnt matter, just to get through the initial 5 second load time.
Sorry I actually had trouble wording this well for some reason, I hope you can follow what I'm trying to do. Thanks
Oh BTW - all of the html is stored locally in my assets folder and I'm using webView.loadUrl("file:///android_asset/About cards.html"); etc to load the pages

What should be the architecture or structure of hybrid app on Android?

I am working on hybrid app and wanted to know the best practices or good way of architecting/structuring the application.
Should one use one webview per activity or should have one single activity with one just webview and change the html pages that are being loaded?
Can one use one webview on multiple activities?
Certain web pages requires loading of heavy resources such as videoview. Due to this I was thinking of using single webview with different activities if its feasible.
You should go with Single Activity with Single Webview. Wherein load the static resources (Html files , js files images etc. )from local location and go to server for dynamic data.
Call for data from server better to use native layer to avoid cross scripting issue. Having said that , Write all the API's in Java and call each api from WebView either using JavaScriptInterface Mechanism or using ShouldOverrideURL method of webview. Recommended is JavaScriptInterface.
To your answer for question : Its always feasible having one webview with multiple activities. but that's not recommended. One Activity is more than enough to take care of loading complete website with different pages in webview.

Android: Best way to Display Images on a screen

This could potentially be a duplicate but I after spending several hours reading about ImageView, ImageSwitcher, Gallery Views, Lazy Loads, and more I decided I should just ask.
I am working on an app and in one of the screens there may be an image or multiple images associate with what I am talking about. The other data for this intent will be pulled from a local database. In the database it will also have a list of URLs of images that are associate with each thing that I am discussing. So I would like to know the best way to display a thumbnail of these pictures (if there are any) on the screen. Then if these pictures are clicked on it can open up the bigger version of these pictures. I don't necessarily want to download these pictures since I don't want to save them locally for the app. Plus I don't want to make the page delay in loading while it waits to download the pictures.
What is the best way to handle this scenario?
I have to caution you, that with newer versions of Android, applications can't make connections to the internet that build the UI directly on the UI thread. Instead, it must be accomplished in a background thread such as ASyncTask. So if you're going to go with making ImageViews without src in your XML, that's fine, but you can't just have the ImageViews go download their images via URL in the onCreate of your main activity any longer. It has to be done in the background, else you'll get an error.
It makes the process fairly more complex, to be honest, but it does improve application responsiveness.
For now, since images aren't the main focus of my app, I decided to just embed a webview in my page and then display the image in some custom html ( I had a list of URLs to the images online). I also calculate the width of the screen and then I adjust how wide the images are going to be in my html.
This was the easiest since the webview takes care of the "threaded" part and I don't have to worry about how to handle/save/and display the images.
It would have been helpful to see a best practices guide when it comes to android and handeling images.

Categories

Resources