Blue Vision (8 Viewers)

[ge2301]

Best case would be, if it can work like this. If you select a right sided GroupMenuItem, current screen slides out to left side and the new screen comes from right side. From the left side vice versa. I have just seen, that ApolloOne for MP1 also does it like this. Unfortunately we can not take over the code

 

[morpheus_xx]

If you select a right sided GroupMenuItem, current screen slides out to left side and the new screen comes from right side. From the left side vice versa.

This is another thing than the screen switch: here we stay in "home" screen and rebuild only contents of center panel (new tiles).

An animated transition would only be possible with two center containers, new one needs to be prepared in background and then animated on screen. This requires code in menu model to keep two different panels.

But indeed, this could create cool transitions

 

[morpheus_xx]

Just tried the Default skin. I don't see any effect during navigation.

It works. Adjust those resources:
https://github.com/MediaPortal/Medi...ult/themes/default/styles/Consts.xaml#L16-L17
Set them to 1 second (00:00:01.00) and then use the "default" skin.

You will see screens fade in/out slowly

 

[morpheus_xx]

Update to animation question: I found an issue with "Screen.Hide" triggers, they were not fully executed, because it's duration was not calculated. This happened only for dialogs and superlayers, not normal screen changes.

Please give it a try: check out the dev branch, open Default skin:

1. Set longer time: Consts.xaml, <ResourceWrapper x:Key="ScreenTransitionEndTime" Resource="00:00:01.00"/>
2. Extend animation: OtherControls.xaml

It adds a translation, screen will be slid out to right side, then next one will slid back into screen

  <Storyboard x:Key="ShowScreenStoryboard" FillBehavior="Stop">
    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" FillBehavior="HoldEnd" Storyboard.TargetName="ScreenAnimationElement" Storyboard.TargetProperty="Opacity">
      <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
      <SplineDoubleKeyFrame KeyTime="{ThemeResource ScreenTransitionEndTime}" Value="1"/>
    </DoubleAnimationUsingKeyFrames>
    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" FillBehavior="HoldEnd" Storyboard.TargetName="ScreenAnimationElement" Storyboard.TargetProperty="RenderTransform.Children[3].X">
      <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1280"/>
      <SplineDoubleKeyFrame KeyTime="{ThemeResource ScreenTransitionEndTime}" Value="0"/>
    </DoubleAnimationUsingKeyFrames>
  </Storyboard>

  <Storyboard x:Key="HideScreenStoryboard" FillBehavior="HoldEnd">
    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" FillBehavior="HoldEnd" Storyboard.TargetName="ScreenAnimationElement" Storyboard.TargetProperty="Opacity">
      <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
      <SplineDoubleKeyFrame KeyTime="{ThemeResource ScreenTransitionEndTime}" Value="0"/>
    </DoubleAnimationUsingKeyFrames>
    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" FillBehavior="HoldEnd" Storyboard.TargetName="ScreenAnimationElement" Storyboard.TargetProperty="RenderTransform.Children[3].X">
      <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
      <SplineDoubleKeyFrame KeyTime="{ThemeResource ScreenTransitionEndTime}" Value="1280"/>
    </DoubleAnimationUsingKeyFrames>
  </Storyboard>

Things to note:

• the duration of animation has big impact on feeling if GUI is "fast" or not.
• Storyboard.TargetProperty="RenderTransform.Children[3].X" means the TranslateTransform, defined at 4th transform in group. You can address any other of them (Scale, Skew, Rotate, Translate)

So you have many possibilities how to modify the screen during transitions

 

[morpheus_xx]

Please continue work on new v6 branch. it's based upon dev now, so the mentioned fix above is included already.

 

[ge2301]

So you have many possibilities how to modify the screen during transitions

Great, I'll try it now In case I want to apply it only for the home screens I need to find another trigger than screen.show

 

[morpheus_xx]

So you have many possibilities how to modify the screen during transitions

Great, I'll try it now In case I want to apply it only for the home screens I need to find another trigger than screen.show

In this case you can simply create a specialized home screen that does not depend on master_bare.xaml. Just copy the wanted stuff over. Or better: create another "master_bare_animated.xaml" and use it as base.

Another thing: I quickly implemented a "IsHomeWorkflowState" property into menu model to bind menu button's visibility to it. It works already, button is only visible in "non-home" screens.

The issue with this approach: all settings screens use a screen base, which shows the menu options always (and not in hidden menu). So there the button logic is wrong (menu is visible).

That's why I would put the button only into master_menu.xaml, because only there the hidden menu is defined. Only thing we need to find out is, how to place button the best way into the intended position.

I would see two options: LayoutTransform to move the button up (not so good), or we define a placeholder in master_bare.xaml and only define a DynamicResource inside master_menu_bare.xaml (better )

 

[ge2301]

In this case you can simply create a specialized home screen that does not depend on master_bare.xaml. Just copy the wanted stuff over. Or better: create another "master_bare_animated.xaml" and use it as base.

But won't be the transition effect for the complete screen when I use a modified "master_bare_animated.xaml" as base? Intended are only the Tiles.
I modified the effect in the direction, that the first screen slides out to left side and next screen fades in from right side. Looks cool

I guess a Grid.Show or Grid.Hide property is not existing, right? In this case I could apply it only to the related part.

 

[morpheus_xx]

But won't be the transition effect for the complete screen when I use a modified "master_bare_animated.xaml" as base?

Correct. I thought you wanted to add some screen transitions only for coming to/leaving from home screen.

I guess a Grid.Show or Grid.Hide property is not existing, right?

Yes, exactly. This are only attached events for Screen.

Not sure if we could invoke a custom event when we set a new main group. Have to think about this.

Back tomorrow...

 

[ge2301]

But won't be the transition effect for the complete screen when I use a modified "master_bare_animated.xaml" as base?

Correct. I thought you wanted to add some screen transitions only for coming to/leaving from home screen.

I guess a Grid.Show or Grid.Hide property is not existing, right?

Yes, exactly. This are only attached events for Screen.

Not sure if we could invoke a custom event when we set a new main group. Have to think about this.

Back tomorrow...

Sorry, maybe I didn't express it well enough. I thought you checked the ApolloOne Movie
But the current screen transision effect is also cool. I'll see what I can do with this!