快速登录:  

Forum: Wishes and new features

话题: Move the best keeper so the MacBook notch is not hiding it in full screen
tslaysPRO InfinityMember since 2023
Can we have an option to move or split the beat keeper so that the notch on the MacBooks are not hiding the UI?
There should be enough space on the right or left side of the notch. Maybe the option could have three option (default center, left, right).
I really love the beat keeper but for me the full screen is so much nicer.

PS: best keeper is beat keeper but I cannot edit the title anymore… :-(
 

发表时间 Sun 16 Jul 23 @ 7:27 am
 

发表时间 Mon 17 Jul 23 @ 9:07 am
Thought this option had been added to the default skins but maybe not....
 

发表时间 Mon 17 Jul 23 @ 10:36 am
Been a while since I updated (I’m on 7482). So maybe it was fixed in later builds.

I’m on vacation, so can’t check my “booth mac” that has the notch.

 

发表时间 Mon 17 Jul 23 @ 1:10 pm
locoDogPRO InfinityModeratorMember since 2013
has_notch is an action so vdj can handle notched screens but it never made it into the default skin.
Honestly if you had any interest at all in skinning this is the kind of task I'd say is suitable to a beginner. [with some guidance]
 

发表时间 Mon 17 Jul 23 @ 1:29 pm
Thanks Locodog,

It’s not that I am against learning about skinning. After all I switched to VDJ for all the features and flexibility. But I am not particularly interested in skinning either, default skins work fine for me.

But if you can point OP TSLAYS and me to a “howto” (or in the right direction) for doing this simple tweak to the default Pro skin, I will definitely try it.

And, if it really _is_ just a simple tweak to an XML file, then my hope is that gently pushing it here in the forum, could make the dev team consider squeezing it into the official shrink wrapped skins in an upcoming release.
After all, new users should not have to be forced to do skinning/scripting to use basic features.
 

发表时间 Mon 17 Jul 23 @ 4:49 pm
locoDogPRO InfinityModeratorMember since 2013
That's the idea of skinning, nobody is going to start learning it by making a skin from scratch. You start by; add/move a button, change a colour, bigger some text, remove something, that kind of thing.

What is a small job for you is quite a bit more for atomix to do, you can please yourself, move the thing where you like [my personal skin has been a WIP for about 8 years now]. Atomix all cases and future cases to consider, so it's not just do the skin and done.
And if time's money then some user might find the time if you've got the money

pro skin lines 1707-1892 is the section we're interested in

<group name="beat_matcher" x="858" y="8">
<group name="phrase_3" x="-35" y="-2" visibility="var_equal '@$phrasecircle' 1 && var_not_equal '@$4decks' 0">
<deck deck="3">
<visual source="get_beat_counter" type="circle">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<off shape="circle" color="dark"/>
<on shape="circle" color="buttonon"/>
</visual>
<visual>
<pos x="+5" y="+5"/>
<size width="20" height="20"/>
<off shape="circle" color="background2"/>
</visual>
<textzone>
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<text fontsize="11" color="textoff2" align="center" weight="" action="get_beat_counter"/>
</textzone>
<button action="phrase_sync 'auto'">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
</button>
</deck>
</group>
<group name="phrase_left" x="+0" y="-2" visibility="var_equal '@$phrasecircle' 1">
<deck deck="1">
<visual source="get_beat_counter" type="circle">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<off shape="circle" color="dark"/>
<on shape="circle" color="buttonon"/>
</visual>
<visual>
<pos x="+5" y="+5"/>
<size width="20" height="20"/>
<off shape="circle" color="background2"/>
</visual>
<textzone>
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<text fontsize="11" color="textoff2" align="center" weight="" action="get_beat_counter"/>
</textzone>
<button action="phrase_sync 'auto'">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
</button>
</deck>
</group>

<group name="phrase_right" x="+40+33+33+33+40" y="-2" visibility="var_equal '@$phrasecircle' 1">
<deck deck="2">
<visual source="get_beat_counter" type="circle">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<off shape="circle" color="dark"/>
<on shape="circle" color="buttonon"/>
</visual>
<visual>
<pos x="+5" y="+5"/>
<size width="20" height="20"/>
<off shape="circle" color="background2"/>
</visual>
<textzone>
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<text fontsize="11" color="textoff2" align="center" weight="" action="get_beat_counter"/>
</textzone>
<button action="phrase_sync 'auto'">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
</button>
</deck>
</group>
<group name="phrase_4" x="+40+33+33+33+40+35" y="-2" visibility="var_equal '@$phrasecircle' 1 && var_not_equal '@$4decks' 0">
<deck deck="4">
<visual source="get_beat_counter" type="circle">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<off shape="circle" color="dark"/>
<on shape="circle" color="buttonon"/>
</visual>
<visual>
<pos x="+5" y="+5"/>
<size width="20" height="20"/>
<off shape="circle" color="background2"/>
</visual>
<textzone>
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
<text fontsize="11" color="textoff2" align="center" weight="" action="get_beat_counter"/>
</textzone>
<button action="phrase_sync 'auto'">
<pos x="+0" y="+0"/>
<size width="30" height="30"/>
</button>
</deck>
</group>

<group name="beatbar" x="+40" y="+2" >
<panel condition="var_equal '@$4decks' 0">
<deck deck="1">
<button class="beat_bar" x="+0" y="+0" action="goto_bar 1"/>
<button class="beat_bar" x="+33" y="+0" action="goto_bar 2"/>
<button class="beat_bar" x="+33+33" y="+0" action="goto_bar 3"/>
<button class="beat_bar" x="+33+33+33" y="+0" action="goto_bar 4"/>
<group x="+4" y="+3" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" x="+0" y="+0" query="get_phrase_num 1"/>
<button class="phrase_bar" x="+33" y="+0" query="get_phrase_num 2"/>
<button class="phrase_bar" x="+33+33" y="+0" query="get_phrase_num 3"/>
<button class="phrase_bar" x="+33+33+33" y="+0" query="get_phrase_num 4"/>
</group>
</deck>
<deck deck="2">
<button class="beat_bar" x="+0" y="+14" action="goto_bar 1"/>
<button class="beat_bar" x="+33" y="+14" action="goto_bar 2"/>
<button class="beat_bar" x="+33+33" y="+14" action="goto_bar 3"/>
<button class="beat_bar" x="+33+33+33" y="+14" action="goto_bar 4"/>
<group x="+4" y="+3" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" x="+0" y="+14" query="get_phrase_num 1"/>
<button class="phrase_bar" x="+33" y="+14" query="get_phrase_num 2"/>
<button class="phrase_bar" x="+33+33" y="+14" query="get_phrase_num 3"/>
<button class="phrase_bar" x="+33+33+33" y="+14" query="get_phrase_num 4"/>
</group>
</deck>
</panel>
<panel condition="var_not_equal '@$4decks' 0" y="-2">
<group>
<deck deck="1">
<button class="beat_bar_narrow" x="+0" y="+0" action="goto_bar 1"/>
<button class="beat_bar_narrow" x="+33" y="+0" action="goto_bar 2"/>
<button class="beat_bar_narrow" x="+33+33" y="+0" action="goto_bar 3"/>
<button class="beat_bar_narrow" x="+33+33+33" y="+0" action="goto_bar 4"/>
<group x="+4" y="+2" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" height="2" x="+0" y="+0" query="get_phrase_num 1"/>
<button class="phrase_bar" height="2" x="+33" y="+0" query="get_phrase_num 2"/>
<button class="phrase_bar" height="2" x="+33+33" y="+0" query="get_phrase_num 3"/>
<button class="phrase_bar" height="2" x="+33+33+33" y="+0" query="get_phrase_num 4"/>
</group>
</deck>
</group>
<group y="+7">
<deck deck="2">
<button class="beat_bar_narrow" x="+0" y="+0" action="goto_bar 1"/>
<button class="beat_bar_narrow" x="+33" y="+0" action="goto_bar 2"/>
<button class="beat_bar_narrow" x="+33+33" y="+0" action="goto_bar 3"/>
<button class="beat_bar_narrow" x="+33+33+33" y="+0" action="goto_bar 4"/>
<group x="+4" y="+2" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" height="2" x="+0" y="+0" query="get_phrase_num 1"/>
<button class="phrase_bar" height="2" x="+33" y="+0" query="get_phrase_num 2"/>
<button class="phrase_bar" height="2" x="+33+33" y="+0" query="get_phrase_num 3"/>
<button class="phrase_bar" height="2" x="+33+33+33" y="+0" query="get_phrase_num 4"/>
</group>
</deck>
</group>
<group y="+7+7">
<deck deck="3">
<button class="beat_bar_narrow" x="+0" y="+0" action="goto_bar 1"/>
<button class="beat_bar_narrow" x="+33" y="+0" action="goto_bar 2"/>
<button class="beat_bar_narrow" x="+33+33" y="+0" action="goto_bar 3"/>
<button class="beat_bar_narrow" x="+33+33+33" y="+0" action="goto_bar 4"/>
<group x="+4" y="+2" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" height="2" x="+0" y="+0" query="get_phrase_num 1"/>
<button class="phrase_bar" height="2" x="+33" y="+0" query="get_phrase_num 2"/>
<button class="phrase_bar" height="2" x="+33+33" y="+0" query="get_phrase_num 3"/>
<button class="phrase_bar" height="2" x="+33+33+33" y="+0" query="get_phrase_num 4"/>
</group>
</deck>
</group>
<group y="+7+7+7">
<deck deck="4">
<button class="beat_bar_narrow" x="+0" y="+0" action="goto_bar 1"/>
<button class="beat_bar_narrow" x="+33" y="+0" action="goto_bar 2"/>
<button class="beat_bar_narrow" x="+33+33" y="+0" action="goto_bar 3"/>
<button class="beat_bar_narrow" x="+33+33+33" y="+0" action="goto_bar 4"/>
<group x="+4" y="+2" visibility="var_equal '@$phrasecircle' 0">
<button class="phrase_bar" height="2" x="+0" y="+0" query="get_phrase_num 1"/>
<button class="phrase_bar" height="2" x="+33" y="+0" query="get_phrase_num 2"/>
<button class="phrase_bar" height="2" x="+33+33" y="+0" query="get_phrase_num 3"/>
<button class="phrase_bar" height="2" x="+33+33+33" y="+0" query="get_phrase_num 4"/>
</group>
</deck>
</group>
</panel>
</group>
</group>



looks a lot but all the positions [x y] are relative except the first pos [which is absolute] for the whole group so it's very easy.

copy the whole wall of code and paste it in just before 1707 or just after 1892
ok 2 blocks of identical code, let's make them conditional.
first line of 1st block
<group name="beat_matcher" x="858" y="8">
change it to
<group name="beat_matcher" x="858" y="8" visibility="not has_notch">

that's the not full screen condition done. This "group" at this position, only visible when no notch


first line of 2nd block
<group name="beat_matcher" x="858" y="8">
change it to
<group name="beat_matcher" x="???" y="8" visibility="has_notch">

the ??? are up to you, all the other positions are relative to this, move the whole collection of elements as one thing,
if you want to get fancy with a "left & right" of the notch then you're dealing with the individual elements but it's not much different.

obviously there's a lot more to skinning, but this as simple an introduction as you'd get.
 

发表时间 Mon 17 Jul 23 @ 5:45 pm
Thanks again Locodog!

I followed your recipe and I can now move the phrase counter out from under the notch! 👍🏻

For others coming by here that have never modified a default skin before, read this for the missing pieces:

https://www.virtualdj.com/wiki/Modify%20a%20Skin.html

I still hope the dev team will eventually incorporate this in the official skins. I hang around in other DJ forums as well, and when people compare DJ apps, it is always stuff like this that scares a potential switcher off.
 

发表时间 Tue 18 Jul 23 @ 8:25 am
tslaysPRO InfinityMember since 2023
I second that. The default skin should support MacBook Pros, as these are industry standards.
I will try it out but there should be an option even if it is experimental...
 

发表时间 Wed 19 Jul 23 @ 12:48 pm
Thank you so much for the instructions! I modified my Pro skin quite easily to move the beat counter over from the notch. I no longer have to have MacOS scale the VDJ app out of the menu bar area, so I have regained some space! Moving it to X=638 was perfect.
 

发表时间 Sat 23 Mar 24 @ 1:31 am
tslaysPRO InfinityMember since 2023
iluvmacs wrote :
Thank you so much for the instructions! I modified my Pro skin quite easily to move the beat counter over from the notch. I no longer have to have MacOS scale the VDJ app out of the menu bar area, so I have regained some space! Moving it to X=638 was perfect.


For the right side, I recommend x="1076". You could even make 2 skins. Notch left and notch right, for easy switching. ;-)
 

发表时间 Mon 25 Mar 24 @ 2:03 am