Android Tutorial Xtraviews: MovieView Tutorial

Introduction

This is a DesignerCustomView control which is based on the native android movie view and will allow you to display animated gifs (transparent ones as well).

How to use

1. Get the latest XtraViews package.
2. Open the IDE and check the XtraView library in the list of libraries.
3. Open the designer, drop a CustomView control, and in the CustomType choose MovieView.

upload_2014-7-13_13-59-32.png



You can load files by using the Load method:
B4X:
'Set the 3rd parameter to true to automatically start it
Movie1.Load(File.DirAssets, "1.gif", False)

Properties: Visible, Stopped, Paused, Frame, Frames, EventsDisabled
Methods: Load
Events: Load, Pause, Stop, Frame, Play

Note: If you are just using it for ajax loaders, then set the Tag property to 1 in order to disable events and save some some serious CPU cycles.


Enjoy! :D
 

Inman

Well-Known Member
Licensed User
Longtime User
Is it possible to dynamically add and remove it via code, instead of using designer?
 

ivan.tellez

Active Member
Licensed User
Longtime User
This is great!

I just have some Questions/suggestions:

This can be used to add custom "loading" views to an app, jus for example, Using Erel's tutorial Download list of images with HttpUtils2 and CustomListView, I think that you can make the ImageView.Visible = False and add a MovieView on top to each List Item and load the "loading" gift animation, then, when the Image is downloaded, just make the ImageView.Visible = True and MovieView.Visible = False.

But there are some problems in here, you can't use the Movie view this way because you get a "Incompatible types":

required: View
found: MovieView

This is because you have to put the View in a panel and use Panel.AddView() to create the Item. It can be done loading a Layout (Not recomended because its slow), but to interact with the objet yo have to use Panel.GetView() and have the same error.

Is there a way to use movieView in the CustomListView?

The other concern its about hardware resources, is too much CPU and memory use to load 50 gifts in the list? Could be a way to store the gift ONCE and be shared by many MovieViews?

How to dispose the animation when you are done with it? In this example when the image is downloaded, you are not to use the animation any more, maybe a "Movie.Unload"?


Thanks :)
 

ivan.tellez

Active Member
Licensed User
Longtime User
Wow, thanks, Ver 1.1 do the trick.

This is great to ad some simple animations to any proyect.

Sadly, when trying to use some loader animations, i'm getting really crappy results due to the implicit limitations of the GIF format (Really old)

You can see thes on the sample2, GIF format supports only absolute transparency or no transparency at all. Therefore, when you set background to transparent, you will still be able to set a background color that will fill the back layer of semi-transparent parts of your image.

Example GIF on the Left.
gif-apng-difference.png


I think that for real life applications, the animation has to support a format with better characteristics.

Please see this examples on Firefox. Note: the effect is more dramatic when the Background its not White


spinfox.gif

This is a GIF


spinfox.png

This is an APNG


Have you heard about APNG?

http://littlesvr.ca/apng/
http://preloaders.net/en/circular
http://animizer.net/

Please let me know what you think about, its is possible to add support for this format in the MovieView?

Thanks
 
Last edited:

Periklis Koutsogiannis

Active Member
Licensed User
Longtime User
We are already on it. It will be a separate view derived from MovieView which means it will have the same properties and methods :)
 

almontgreen

Active Member
Licensed User
Longtime User
We are already on it. It will be a separate view derived from MovieView which means it will have the same properties and methods :)
Will decoding APNG be a problem for Android? I am working with 1920x1080 resolution JPEG sequences and loading them into ram is a problem. The .mp4 video files do not have frame access to step through the file forward and backward in a predictable way. In the old days, I used M-JPEG and most libraries had frame access. Now everything is optimized for streaming and people look at you cross-eyed when you say you want to step through the file forwards and backwards (scrubbing) like for a video editing program. GIF, with it's limited 256 color pallet isn't very useful even with lots of diffusion. M-JPEG would probably be ok if there wasn't an image size limitation. I can't find an encoder that works at HD resolution. APNG would probably be a good solution so I'm very interested to learn what might be happening with it.

Any Updates? Happy to donate to a project that solves this (and also the RAM limitations of Android, as I'd like my app to take over the device completely to optimize performance and stability). My device (Minix Neo x8) has 4k video output, so even 1920x1080 is "small" to me, but I can work with it for now.

Essentially, I need to step forward and backward very quickly through 1920x1080 size images (at least showing 10 images a second at that resolution!) This is proving to be a very big challenge.
 

Straker

Active Member
Licensed User
Longtime User
I downloaded the library and I'm trying the movieView Sample1 example.
But there is no movie...
On _Load event, Frames are always zero.
I've tried also copying the .gif files from DirAssets to DirRootExternal (and of course modifying the .Load line), but still I can't see any movie.
The counter is running xxx/0 (frame is changing, but total is zero).

I didn't change anything in the sample files.
Can someone help me to resolve this issue?
 

clydebamford

Member
Licensed User
Longtime User
seems it might be an issue with Genymotion and your pc's video driver. I got it sorted after upgrading my video drivers.
 

itgirl

Active Member
Licensed User
Longtime User
seems like MovieView does not work with android 4.0 ... any thoughts on whats the minsdk to use ?
 
Top