Solved How can I hide video player controls when video is clicked?
#1
This is one of the last features I need for my new skin and I'm really struggling with it. My question is: When a video is playing and the video playback controls are showing I would like the controls to be hidden when the video itself is (left) clicked. Is this at all possible to do?

I would really appreciate your help! Thank you for reading.

Here is the code on Github if that helps: https://github.com/craig131/iOSinspired. It is mostly Confluence code right now, so if it works for Confluence it will definitely work for my skin.

----------------------------------------------

SOLUTION for anyone from the future who stumbles across this thread and wants to implement the same feature, here is an excellent solution as proposed by joe6pack below. (Thank you to everyone else who commented as well, you are all awesome!)

We are going to make a big invisible button that is only active when the playback controls are displayed. This button will only cover the area between the playback controls and will only be active when the controls are displayed. This may seem like a dumb solution, but the end result is actually excellent.

I am inserting this code into VideoOSD.xml but place it wherever you feel is appropriate:

Code:
        <control type="button" id="1">
            <description>Invisible button so controls hide when video tapped</description>
            <!-- Change the following positioning tags so button is in correct place, see last comment below for easy positioning -->
            <posx>0</posx>
            <posy>84</posy>
            <!-- Set width and height to cover the correct amount of space -->
            <width>1280</width>
            <height>518</height>
            <!-- If not placing this code in VideoOSD.xml, change visibility settings as appropriate -->
            <visible>true</visible>
            <!-- For easier positioning of button, delete the following 2 lines to temporarily make button appear as a blue box instead of transparent -->
            <texturefocus></texturefocus>
            <texturenofocus></texturenofocus>
            <align>left</align>
            <aligny>top</aligny>
            <onclick>Dialog.Close(videoosd)</onclick>
        </control>

That should do it!
Reply
#2
It's only visible because you're using a mouse and mouse movement opens it.
Reply
#3
(2015-01-11, 11:24)Hitcher Wrote: It's only visible because you're using a mouse and mouse movement opens it.

I think we have a misunderstanding because I am having trouble explaining what I am trying to do here. I am happy with how the controls are shown, but I would like them to be hidden when the video is clicked. The reason for this is that I am making a mobile skin for Kodi (screenshot) and it is not quite right that the only way to make the playback controls disappear is to just wait for them to fade away. With normal mobile video players, tapping the playing video will reveal the controls and tapping the video again will make the controls disappear. This is what I'd like to recreate with my skin. I hope this makes more sense, I have a lot of trouble articulating things like this.
Reply
#4
Have a look how it's done in the re-touched skin. Maybe you'll find a solution. It's the only hint i can give you as i'm really not familiar with skinning for touch devices.
Another idea could be making a conditional visible animation, example saying hide my controls after a few seconds.
Reply
#5
(2015-01-11, 20:57)butchabay Wrote: Have a look how it's done in the re-touched skin. Maybe you'll find a solution. It's the only hint i can give you as i'm really not familiar with skinning for touch devices.
Another idea could be making a conditional visible animation, example saying hide my controls after a few seconds.

I have tried that unfortunately (I have taken a lot of inspiration from Re-touched) but sadly it has the same system as Confluence where the controls are only hidden when a few seconds have passed without interaction. Is this an indicator that it is not possible to hide the controls through another way? I was hoping that there was an XML window file somewhere that had <onclick>show.controls</onclick> or something similar and I could add a conditional statement that "if controls are showing, onclick hide controls" and I just couldn't find it.

Also in every skin it appears that right-clicking (or long-pressing on touchscreen) while the controls are shown hides the controls in exactly the way I want, which I thought I could engineer to left-click (or short press) for the perfect solution. Unfortunately I can't find an XML file that controls this behavior. I was hoping someone here might have an idea where I should look for this.
Reply
#6
You could try to add a transparent button covering the video to the videoosd with <onclick>Dialog.Close(videoosd)</onclick> or <onclick>Dialog.Close(2901)</onclick>. Never tried it in the osd, though...
Reply
#7
(2015-01-11, 23:34)joe6pack Wrote: You could try to add a transparent button covering the video to the videoosd with <onclick>Dialog.Close(videoosd)</onclick> or <onclick>Dialog.Close(2901)</onclick>. Never tried it in the osd, though...

That is an interesting, albeit roundabout solution. Thank you! I still wish there was a more direct way to achieve this (unlike making a giant, persistent, fully transparent button) but yours seems to be the best solution we have.

This is such an awesome community. I'm glad I've found all of you Smile
Reply
#8
the mapping of gestures to actions is handled by our keymap.
a 'longpress' will close the video osd.

this is the same for any window / dialog in kodi:
a 'tap' (ie short press) will open a window or dialog,
and a 'longpress' will close the window or dialog again.
Do not PM or e-mail Team-Kodi members directly asking for support.
Always read the Forum rules, Kodi online-manual, FAQ, Help and Search the forum before posting.
Reply
#9
(2015-01-12, 02:58)ronie Wrote: the mapping of gestures to actions is handled by our keymap.
a 'longpress' will close the video osd.

this is the same for any window / dialog in kodi:
a 'tap' (ie short press) will open a window or dialog,
and a 'longpress' will close the window or dialog again.

Ah I see, that makes sense. So unfortunately that means I can't use this vector to add this feature, as it would have consequences with other parts of the OSD interface (not to mention I can't bundle the keymap file with my skin for easy distribution). I guess I'll have to either go with the giant transparent button idea or skip this relatively unimportant feature. Not a big deal, but it is a bit of a shame.
Reply
#10
(2015-01-11, 23:34)joe6pack Wrote: You could try to add a transparent button covering the video to the videoosd with <onclick>Dialog.Close(videoosd)</onclick> or <onclick>Dialog.Close(2901)</onclick>. Never tried it in the osd, though...

I implemented your solution, Joe and it is actually very excellent, I'd say perfect! Thank you very much! I have edited my post to share the solution code and I made sure to give you credit. Thanks again, you are awesome!
Reply
#11
No, I'm not awesome Smile but glad I could help.
Reply
#12
(2015-01-12, 02:58)ronie Wrote: the mapping of gestures to actions is handled by our keymap.
a 'longpress' will close the video osd.

this is the same for any window / dialog in kodi:
a 'tap' (ie short press) will open a window or dialog,
and a 'longpress' will close the window or dialog again.
I hope it's not discourteous for me to ask a question or two in the OP's string.

What is a 'longpress', and how do I do it on Windows?

Thanks.
Reply
#13
Ah, after experimenting around, I see that a right-mouse click hides the controls.

So, in the words of Anna Roseannadanna, "Never mind....".
Reply

Logout Mark Read Team Forum Stats Members Help
How can I hide video player controls when video is clicked?1