#1 2016-01-01 18:47:47

edunt
Member
Registered: 2015-12-21
Posts: 258

{SOLVED} Mediaplayer controls in Mobile App

Hi,

How do I display full Mediaplayer controls for Audio and Video in Mobile Apps?

Thanks.

Last edited by edunt (2016-01-06 11:20:20)

Offline

#2 2016-01-01 19:00:29

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello edunt,

Sorry, but I can't understand very well what you mean. Please, can you explain a little more?

Offline

#3 2016-01-02 02:45:53

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

David wrote:

Hello edunt,

Sorry, but I can't understand very well what you mean. Please, can you explain a little more?

I mean, I want to see "Stop, Seek bar, Volume" on Mediaplayer.
Thanks

Offline

#4 2016-01-02 03:21:49

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello edunt,

Are you sure the MediaPlayer control "Controls" variable is "True"?

The VideoPlayer sample appear working as expected in my Android device:

1b02Vgd.png

Offline

#5 2016-01-02 14:49:49

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi David,

Yes, it is true.

What about for Audio?

Thanks.

Last edited by edunt (2016-01-02 14:50:37)

Offline

#6 2016-01-02 15:02:33

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello edunt,

2ObGv8y.png

Also the SimpleAudio sample works well here. What's your experience?

Offline

#7 2016-01-02 15:06:50

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi David,

My experience with simpleaudio is just displaying paly/pause button abd timer and enlarge icon on Samsung 4.5" screen.
Thanks.

Offline

#8 2016-01-02 15:09:28

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

Are you using the app's scale option?

UV2GQ8U.png

On the other hand, maybe it's not a bad good idea to hide the default controls and use our own ones.

Offline

#9 2016-01-02 15:50:03

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi David,

Yes, Autoscale app size is selected by default.

This is what I get, 38+ minutes audio, see what sart minutes is.

ihBi8OM.png

Last edited by edunt (2016-01-02 15:51:12)

Offline

#10 2016-01-02 16:03:16

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

If you try the application in a browser you get a similar result?

Can you try also with other media player and the same media file?

Offline

#11 2016-01-02 16:38:22

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi David,

No, I did not get same display as yours. I used Bluestack App Player to run the *.apk.
Thanks.

Last edited by edunt (2016-01-02 19:01:29)

Offline

#12 2016-01-02 19:10:47

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

Sorry, I don't understand what do you mean when say "I used Bluestack App Player to run the *.apk". On the other hand, I presume than Videogular (the plugin behind the MediaPlayer Control) take the information from the media file, or maybe such information is provided by the browser, taken first from the media file. Honestly, I don't know what to say. Do you test the application in various browsers? All of them offer the same media file duration? If so, maybe the file information is not completely right or something like that.

Offline

#13 2016-01-02 19:17:25

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi,

I mean I installed sampleaudio apk in Bluestack Android App Player to test the application before running it on real device.

Have a look at this 5K2dy1H.png
Thanks.

Offline

#14 2016-01-02 19:42:07

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello edunt,

Where are your media files localed? Remember they must be in a remote server if our applications is running on Cordova, so, maybe this also occur with the "Bluestack Android App Player".

Offline

#15 2016-01-02 19:50:45

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Offline

#16 2016-01-02 20:10:27

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

If you try the application in a browser you get a similar result? (I ask this question above too). And what happend if you try with other media files?

Offline

#17 2016-01-03 02:21:46

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi,

Running SimpleAudio on browser I got different display as yours. Mine is no progress bar display.
Thanks

Offline

#18 2016-01-03 16:38:37

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

I think this is due to the progress bar and media playercolors. You can try with this CSS rule in your app's Inline CSS option, for example:

/* Customize the MediaPlayer control progressbar */

vg-scrub-bar [role="slider"]
{
  background-color: red !important;
}

Looking into this I found certain problem with the MediaPlayer in larger screens. I am working trying to solve it.

Offline

#19 2016-01-03 18:31:20

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello edunt,

My apologies. Certainly the above CSS code can be used to customize the progress bar of a MediaPlayer control, however, in fact you can't view the progressbar appropiately due to an error, introduced in the latest Videogular update. The problem is not exactly related itself with Videogular, but with their CSS integration into App Builder. So please, update your copy of App Builder edunt and tell me if the MediaPlayer progress bar works for you now.

93jqYYb.gif

Offline

#20 2016-01-03 22:49:35

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi David,

Yes, the player progress bar is now working.
Thanks.

Last edited by edunt (2016-01-03 23:22:19)

Offline

#21 2016-01-07 14:24:36

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

David wrote:

Hello,

I think this is due to the progress bar and media playercolors. You can try with this CSS rule in your app's Inline CSS option, for example:

/* Customize the MediaPlayer control progressbar */

vg-scrub-bar [role="slider"]
{
  background-color: red !important;
}

Looking into this I found certain problem with the MediaPlayer in larger screens. I am working trying to solve it.

Hi David,

Where can I find the inline css option you are referring to?
Thanks.

Offline

#22 2016-01-07 14:34:44

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

We can use the object inspector once select the application:

uLWLbP6.png

Also we can use the app's options dialog under the Style tab.

Offline

#23 2016-01-07 15:41:40

edunt
Member
Registered: 2015-12-21
Posts: 258

Re: {SOLVED} Mediaplayer controls in Mobile App

Hi,

Alright, if add the code. I get this:

I7rsh8T.png

But if I click the progress bar I got this

NwbdfMy.png

What could be the issue?

Thanks.

Offline

#24 2016-01-07 15:52:25

David
Admin
From: Alcobendas, Madrid, Spain
Registered: 2015-04-21
Posts: 1,660
Website

Re: {SOLVED} Mediaplayer controls in Mobile App

Hello,

I can't reproduce the problem. The CSS rule works for me.

TkBp2qj.png

Offline

Board footer

Powered by FluxBB


Copyright ©2018 DecSoft. All rights reserved.