This is a migrated thread and some comments may be shown as answers.

RadRibbonView and FlowDirection

11 Answers 100 Views
RibbonView and RibbonWindow
This is a migrated thread and some comments may be shown as answers.
Alexandre
Top achievements
Rank 1
Alexandre asked on 07 May 2020, 01:36 PM

Hello,

I have a window that contains a RadRibbonView:

<telerik:RadRibbonView x:Name="PART_MainMenu" BackstageClippingElement="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=telerik:RadDockPanel}}"  IsMinimizable="true">
            <telerik:RadRibbonView.Backstage>
                <telerik:RadRibbonBackstage x:Name="backstage" BackstagePosition="Office2013" Background="{StaticResource ATS_Brush_Gray240}">                                    <telerik:RadRibbonBackstageItem Header="Informations">
                        <Grid>
                            <TextBlock Text="Log-out" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="DarkSlateGray"/>
                        </Grid>
                    </telerik:RadRibbonBackstageItem>                                       
                </telerik:RadRibbonBackstage>
            </telerik:RadRibbonView.Backstage>

</telerik:RadRibbonView>

 

I display a simple text "Log-out" in a single telerik:RadRibbonBackstageItem.

I change by code the property Thread.CurrentThread.CurrentUICulture to an arabic culture.

I change equally by code the property FlowDirection of the window to the value RightToLeft.

Because of property value inheritance, this property is supposed to be automatically changed for all child elements.

However, the text is mirrored (see file in attachment).

How can we fix that issue ?

 

Thanks,

Alexandre

11 Answers, 1 is accepted

Sort by
0
Vladimir Stoyanov
Telerik team
answered on 12 May 2020, 07:41 AM

Hello Alexandre,

Thank you for the shared picture. 

I tested the described scenario on my end, however I was not able to replicate the shown result. I am attaching the sample project that I used for testing purposes.

Can you check it out and see how it differs from the setup on your end? You can also place a TextBlock outside the RadRibbonView to see, if the same behavior is reproduced. 

I hope you find this helpful.

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Alexandre
Top achievements
Rank 1
answered on 14 May 2020, 03:34 PM

Hello Vladimir,

 

Thanks for your answer.

However, I reproduced the issue using your sample project.

I just made a few modifications:

  • I removed the Flow direction property setting from the MainWindow xaml code
  • I added a button in the view to be able to change the culture and flow direction in Runtime:

<Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="50"  />
                                <RowDefinition Height="50"  />
                            </Grid.RowDefinitions>
                            <Button Grid.Row="0" Click="Button_Click">Switch to Right to left direction</Button>
                            <TextBlock Grid.Row="1" Text="Log-out" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="DarkSlateGray"/>
                        </Grid>

  • I removed culture change from the constructor

 

 

    public MainWindow()
        {
            InitializeComponent();
        }

  • I added the button click button to change the culture and the FlowDirection property of the MainWindow:
            private void Button_Click(object sender, RoutedEventArgs e)
            {
                var culture = new CultureInfo("ar");
                Thread.CurrentThread.CurrentCulture = culture;
                Thread.CurrentThread.CurrentUICulture = culture;

                this.FlowDirection = FlowDirection.RightToLeft;
            }
0
Vladimir Stoyanov
Telerik team
answered on 19 May 2020, 07:30 AM

Hi Alexandre,

Thank you for the update. 

When changing the culture and flow direction during runtime, you can make sure to force the controls to be redrawn. Here is an example approach for that:

var culture = new CultureInfo("ar");
Thread.CurrentThread.CurrentCulture = culture;
Thread.CurrentThread.CurrentUICulture = culture;

this.FlowDirection = FlowDirection.RightToLeft;

var template = this.Template;
this.Template = null;
this.Template = template;

            // This is needed to reopen the backstage after the control is redrawn 
            Dispatcher.BeginInvoke(new Action(() =>
            {
                this.PART_MainMenu.IsBackstageOpen = false;
                this.PART_MainMenu.IsBackstageOpen = true;
            }), DispatcherPriority.Loaded);

Do try this out and let me know how it goes. 

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Alexandre
Top achievements
Rank 1
answered on 20 May 2020, 08:40 AM
Hi Vladimir,

Thanks for your answer.

I subscribed to the value changed of the dependency property FlowDirection:

var pd = DependencyPropertyDescriptor.FromProperty(FlowDirectionProperty, typeof(MainWindow));
            pd.AddValueChanged(this, OnFlowDirectionPropertyChanged);

And I execute your code in the callback OnFlowDirectionPropertyChanged.

It works well with your sample project but unfortunately, the view becomes unclickable in my project.

Do you have any idea about this issue ?

Regards,
Alexandre
0
Vladimir Stoyanov
Telerik team
answered on 22 May 2020, 10:42 AM

Hello Alexandre,

Thank you for the update. 

It is difficult to say what might be the reason for the described behavior without being able to replicate it on my end. What comes to mind is delaying the refreshing of the Template property. You can try wrapping the switching of the Template in another Dispatcher: 

Dispatcher.BeginInvoke(new Action(() =>
{

var template = this.Template;
this.Template = null;
this.Template = template;

            // This is needed to reopen the backstage after the control is redrawn 
            Dispatcher.BeginInvoke(new Action(() =>
            {
                this.PART_MainMenu.IsBackstageOpen = false;
                this.PART_MainMenu.IsBackstageOpen = true;
            }), DispatcherPriority.Loaded);

}), DispatcherPriority.Loaded);

If the above suggestion does not prove helpful, you can modify the sample project in order to better resemble your scenario, replicate the observed on your end behavior and you can send it over in a new support ticket (since project files cannot be added to forum posts). This will hopefully allow me to investigate further and better assist you.  

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Alexandre
Top achievements
Rank 1
answered on 28 May 2020, 08:21 AM
Hello Vladimir,

Sorry, the above suggestion does not prove helpful.
As suggested, I modified the sample project to reproduce the issue.
I created a UserControl named MainMenuView.
I moved the full code of the RadRibbonView (xaml and code behind) into this UserControl.
The window contains only the reference to this UserControl:
<local:MainMenuView />
After clicking on button to change FlowDirection, the view becomes unclickable.

Regards,
Alexandre
0
Vladimir Stoyanov
Telerik team
answered on 02 Jun 2020, 07:07 AM

Hello Alexandre,

I modified the sample project attached earlier, however I was not able to reproduce the described behavior. On my end, I can interact with the backstage items after the FlowDirection and culture are changed.

I am attaching back the updated sample project, which I used for testing. Can you check it out and let me know, if I am missing something? 

I am looking forward to your reply. 

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Alexandre
Top achievements
Rank 1
answered on 02 Jun 2020, 12:18 PM

Hello Vladimir,

Thanks for the updated sample project.
Actually, if we move the FlowDirection code (subscription and callback) from the code behind of the Window to the code behind of the UserControl, the view becomes unclickable.

With your sample, it is indeed possible to interact with the backstage items again.

However, there is a flickering view issue : we can see very quickly the other backstage item.
Do you know why the code doesn’t work when it is executed in the code behind of the UserControl ?
How can we avoid this flickering view issue ?

Regards,
Alexandre

0
Vladimir Stoyanov
Telerik team
answered on 05 Jun 2020, 09:22 AM

Hello Alexandre,

You can make sure to reset the Template of the MainWindow when executing the code from the UserControl:

public partial class MainView : UserControl
    {
        public MainView()
        {
            InitializeComponent();

            var pd = DependencyPropertyDescriptor.FromProperty(FlowDirectionProperty, typeof(MainWindow));
            pd.AddValueChanged(this, OnFlowDirectionPropertyChanged);
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            this.ParentOfType<MainWindow>().FlowDirection = FlowDirection.RightToLeft;
        }

        private void OnFlowDirectionPropertyChanged(object sender, EventArgs e)
        {
            var culture = new CultureInfo("ar");
            Thread.CurrentThread.CurrentCulture = culture;
            Thread.CurrentThread.CurrentUICulture = culture;

            var window = this.ParentOfType<MainWindow>();
            var template = window.Template;
            window.Template = null;
            window.Template = template;

            // This is needed to reopen the backstage after the control is redrawn 
            Dispatcher.BeginInvoke(new Action(() =>
            {
                var ribbonView = this.ChildrenOfType<RadRibbonView>().First();

                ribbonView.IsBackstageOpen = false;
                ribbonView.IsBackstageOpen = true;
            }), priority: DispatcherPriority.ApplicationIdle);

        }
    }

With regards to the flickering, I am afraid that I cannot suggest a way to avoid it. It takes some time in order for the view to be redrawn, which is necessary to reset the culture. 

I hope you find this helpful. 

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Alexandre
Top achievements
Rank 1
answered on 08 Jun 2020, 08:42 AM

Hello Vladimir,

Thanks ! The code works well in the UserControl.

I would like to know if there will be a fix in the next Telerik deliveries to avoid any control redraw when changing the flow direction of the application ?

Regards,

Alexandre

 

 

0
Vladimir Stoyanov
Telerik team
answered on 11 Jun 2020, 07:31 AM

Hello Alexandre,

I am glad to hear that you found the previous suggestion helpful. 

I am afraid that there isn't an option to avoid the redrawing when the FlowDirection is changed. The same will be true for any other WPF control. It is important for a control to be redrawn in order for it to be displayed with the new flowdirection. The heavier the control is (the more UIElements that is has) , the redrawing will be more noticable, since it takes some time.

Regards,
Vladimir Stoyanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
RibbonView and RibbonWindow
Asked by
Alexandre
Top achievements
Rank 1
Answers by
Vladimir Stoyanov
Telerik team
Alexandre
Top achievements
Rank 1
Share this question
or