ExplorerBar - Change item attributes

[Doug]

I'm using the PageView in ExplorerBar ViewMode.  I would like to change all of my PageViewPages so that:

1. The item height is smaller (shorter).

2. Mouseover doesn't change the item color.

3. Select/Deselect doesn't change the item color.

4. I'm going to set up two images to use to indicate whether the user can expand or collapse a page.  I think I can manage that much.  But if you have any suggestions, especially for pushing the image over to the right side, I would be happy to read them.

Thank you.

[Ivan Todorov]

Hi Gary,

Thank you for contacting us.

I am attaching a small sample project which demonstrates how to achieve your requirements. Additional details can be found in the source code comments.

I hope this will help. Feel free to ask if you have any additional questions.

Greetings,
Ivan Todorov
the Telerik team

[Doug]

Last year I worked out the solution from your previous answer and example project.  But it didn't work as I expected.  Now I'm working on a user control and I need to revisit this.  The attached image may be helpful.  (This is continuing my other questions that started in the RadDock section and my project has attempted to use either a TreeView or a ListView.  ListView wins and when the next update comes out I'll be able to implement the DragDrop features and complete this user control.)

The PageView (ViewMode: ExplorerBar) has two pages.  I set its ViewElement.AutoSizeMode to FitToAvailableSize and ViewElement.ContentSizeMode to AutoSizeToBestFit.  In the constructor (user control) I have this code concerning the PageView.

pvMain.HorizontalScroll.Visible = false;
((RadPageViewLabelElement)((RadPageViewExplorerBarElement)pvMain.ViewElement).Children[1]).Visibility = ElementVisibility.Collapsed;
foreach (RadPageViewPage pvp in pvMain.Pages)
{
    //pvp.Item.BackColor = pvp.Item.BackColor;
    //pvp.Item.BackColor2 = pvp.Item.BackColor2;
    //pvp.Item.BackColor3 = pvp.Item.BackColor3;
    //pvp.Item.BackColor4 = pvp.Item.BackColor4;
    ((RadPageViewExplorerBarElement)pvMain.ViewElement).GetContentAreaForItem(pvp.Item).Padding = new Padding(0);
    pvp.Item.IsSelected = false;
    pvp.Item.Padding = new Padding(0, 2, 4, 1);
}

1.  I commented out the four lines concerning the BackColorX properties.  I understand that that code is supposed to prevent mouseover from changing the item color.  But it makes the item color a gradient gray.  I want the colors of the current theme to be unchanged.  What am I missing?

2. I want the pages to always be expanded and selecting a page to have no effect.  I haven't discovered how to do that yet. 

Update: I found this in the documentation and it works for me.

private void pvMain_PageCollapsing(object sender, RadPageViewCancelEventArgs e)
 {
     e.Cancel = true;
 }

3. Double-clicking a listview item is handled programmatically to move to the other ListView and then the ListViews resize to fit their contents.  But until you move the scrollbar on the PageView or resize the ToolWindow, the page sizes do not change.  I want them to adjust to fit their content again.  How do I do that?

Update: I found ScrollToItem() in the documentation about customizing the ExplorerBar, Scroll section.  So I added that to each ListView DoubleClick event and it works for me.

//For now both "ScrollToItem" methods scroll to the same item.
        private void lvInUse_DoubleClick(object sender, EventArgs e)
        {
            if (lvInUse.SelectedItem != null)
            {
                lvAvailable.Items.Add(lvInUse.SelectedItem);
                ResetListHeights();
                ResetPanel();
                ((RadPageViewExplorerBarElement)pvMain.ViewElement).ScrollToItem((RadPageViewExplorerBarItem)pvpInUse.Item);

            }
        }

        private void lvAvailable_DoubleClick(object sender, EventArgs e)
        {
            if (lvAvailable.SelectedItem != null)
            {
                lvInUse.Items.Add(lvAvailable.SelectedItem);
                ResetListHeights();
                ResetPanel();
                ((RadPageViewExplorerBarElement)pvMain.ViewElement).ScrollToItem((RadPageViewExplorerBarItem)pvpInUse.Item);
            }
        }

ary

[Peter]

Hello Gary, 

Thank you for writing back.

I am not able to reproduce the issue with gray color, please, refer to the attached screenshot from my attempts. It seems that there is something specific that I am missing. Could you specify in more details where is the gray color and/or modify the project from the previous answer and send it back. 

As to your second question I can confirm that your approach is correct.

I am looking forward to your reply.

Regards,
Peter
Telerik

[Doug]

Hello Peter,

I set up another project to deal with just this PageView mouseover issue.  Here is all the code for the form:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using System.Threading;
using System.Globalization;

using Telerik.WinControls;
using Telerik.WinControls.UI;
using Telerik.WinControls.Themes;

namespace BaseWindowsApplication
{
    public partial class Form1 : Telerik.WinControls.UI.RadRibbonForm
    {


        public Form1()
        {
            InitializeComponent();
            LoadThemes();

            foreach (RadPageViewPage pvp in pvTest.Pages)
            {
                pvp.Item.BackColor = pvp.Item.BackColor;
                pvp.Item.BackColor2 = pvp.Item.BackColor2;
                pvp.Item.BackColor3 = pvp.Item.BackColor3;
                pvp.Item.BackColor4 = pvp.Item.BackColor4;
            }
        }



        private void LoadThemes()
        {
            CreateThemeMenuItem(mnuVisualStyle, "Default", "Default");
            CreateThemeMenuItem(mnuVisualStyle, "Aqua", "Aqua");
            CreateThemeMenuItem(mnuVisualStyle, "Breeze", "Breeze");
            CreateThemeMenuItem(mnuVisualStyle, "Desert", "Desert");
            CreateThemeMenuItem(mnuVisualStyle, "Office 2007 Black", "Office2007Black");
            CreateThemeMenuItem(mnuVisualStyle, "Office 2007 Silver", "Office2007Silver");
            CreateThemeMenuItem(mnuVisualStyle, "Windows 7", "Windows7");
        }

        private void CreateThemeMenuItem(RadMenuItem parentMenu, string menuName, string themeName)
        {
            RadMenuItem newMenuItem = new RadMenuItem(menuName, themeName);
            newMenuItem.Click += new EventHandler(themeMenuItem_Click);
            parentMenu.Items.Add(newMenuItem);
        }

        void themeMenuItem_Click(object sender, EventArgs e)
        {
            RadMenuItem menuItem = sender as RadMenuItem;
            ThemeResolutionService.ApplicationThemeName = menuItem.Tag as string;
        }

    }
}

The attached image shows what I see when I run this project.  The Aqua theme is pretty "special".  I won't be using that (image also attached).

Note: When I encountered this in my earlier project, I solved it by setting the backcolors to the RGB values that they were in the default theme.  And I didn't use any other themes in that project.

Thank you,
Gary

[Peter]

Hi Gary,

Thank you for the clarifications.

It seem that the Aqua theme does not set the GradienStyle property and BackColorX properties and in this case your workaround is correct.

Should you have any other questions, do not hesitate to ask.

Regards,
Peter
Telerik

[Doug]

Peter,

That's interesting about the Aqua theme.  But what about the default theme?  That's the theme I'm using where the gradient colors are gray as seen in the "PageView-ExplorerBar-Item-BackColor.png" image.

Thank you,
Gary

[Peter]

Hi Gary,

Thank you for the provided details.

Actually these lines:

pvp.Item.BackColor = pvp.Item.BackColor;
pvp.Item.BackColor2 = pvp.Item.BackColor2;
pvp.Item.BackColor3 = pvp.Item.BackColor3;
pvp.Item.BackColor4 = pvp.Item.BackColor4;

set the values of the BackColors with a LocalValue priority which have a greater priority than the theme and the latter cannot apply its values. 

You can set the values as DefaultValue which have a lower priority than theme and in this case it will be able to override those settings:

pvp.Item.SetDefaultValueOverride(LightVisualElement.BackColorProperty, Color.Green);

I hope this helps.

Regards,
Peter
Telerik