Changing color of item and its controls in ListView

5 posts, 1 answers
  1. KTK
    KTK avatar
    11 posts
    Member since:
    Oct 2013

    Posted 14 Jan Link to this post

    Hello,

    I have a RadListView with custom VisualItem (see first png) and my goal is to remove the highlight on selected item. Is there a way how to disable this feature in program so I dont have to create new theme?

    And second question is about that little X buttons, I want to assign them a theme, but they are not RadButtons, but RadButtonElements and they seems to have no Theme property.


    Thank you.

  2. Ralitsa
    Admin
    Ralitsa avatar
    176 posts

    Posted 18 Jan Link to this post

    Hello Jan,

    Thank you for contacting us. 

    In order to customize the selected item, you can subscribe to the VisualItemFormatting event and change the BackColor or other properties. Please take a look at the following code snippet: 
    void radListView1_VisualItemFormatting(object sender, ListViewVisualItemEventArgs e)
    {
        if (e.VisualItem.Selected == true)
        {
            e.VisualItem.BackColor = Color.Transparent;
            e.VisualItem.NumberOfColors = 1;
            e.VisualItem.GradientStyle = Telerik.WinControls.GradientStyles.Solid;
        }
        else
        {
            e.VisualItem.ResetValue(LightVisualElement.BackColorProperty, Telerik.WinControls.ValueResetFlags.Local);
            e.VisualItem.ResetValue(LightVisualElement.NumberOfColorsProperty, Telerik.WinControls.ValueResetFlags.Local);
            e.VisualItem.ResetValue(LightVisualElement.GradientStyleProperty, Telerik.WinControls.ValueResetFlags.Local);
        }
    }

    In regards to your second question, you can use the API for overriding theme setting at run time and the changes will apply only over the desired item. More information can be found on the following article: Override Theme Settings at Run Time. We introduced this functionality with the UI for WinForms Q3 2015 release. 

    In the attachments, you can find a sample demo demonstrating how to change the themes setting of RadButtonElement.

    I hope this information helps. Should you have further questions I would be glad to help.

    Regards,
    Ralitsa
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for WinForms is Visual Studio 2017 Ready
  4. KTK
    KTK avatar
    11 posts
    Member since:
    Oct 2013

    Posted 21 Jan in reply to Ralitsa Link to this post

    Hello Ralista,
    Thank you for your help! I tried your solution but it didnt work for me the way I wanted to. Mainly because I provided you poor information about the problem. I am sorry. Can you please try to help me out once more?

    In my application I have custom theme for RadButton built in Visual Style Builder, is there a way how I can bind this theme to the RadButtonElement? I tried to follow these insctructions : http://www.telerik.com/forums/apply-theme-to-radbuttonelement but without success. Maybe the source is outdated.
    By changing the Theme, I was thinking to change the Theme property, rather than changing colors one by one. Something like
    this.radButton1.ThemeName = "MyCustonTheme";

     

    Subscribing to the VisualItemFormatting works great, but I have no clue how to preserve the mouse hover effect. I still want the item to be "semi-highlighted" like the others after running mouse over them. Is that possible within the code, or should I be trying to make my own theme in Visual Style Builder that serves my needs?

     

    Thank you,

    Jan

  5. Answer
    Ralitsa
    Admin
    Ralitsa avatar
    176 posts

    Posted 25 Jan Link to this post

    Hi Jan,

    Thank you for provided detailed description of your case. 

    We provide a way to apply custom themes per control. You can set the ThemeName property of RadListView and the theme will apply on the RadButtonElement from the custom SimpleListViewVisualItem. In the code snippet below you can find a sample how to achieve it: 
    ThemeResolutionService.LoadPackageFile(@"C:\TelerikMetroCustom.tssp");
    this.radListView1.ThemeName = "TelerikMetroCustom";

    More information how to apply custom theme can be found here: Themes >> Using custom themes

    By default the style settings are not changed when hovering a selected item. You can achieve it by modifying the theme or using the API for overriding theme settings. 

    In order to change the settings in a custom theme you need to follow these steps: 
    1. Start the Visual Style Builder application 
    2. Load your custom theme 
    3. Select SimpleListViewVisualItem and add new Element State - SimpleListViewVisualItem.ContainsMouse.MouseOver.IsHotTracking.Current.Selected 
    4. Change all necessary properties to customize the desired color like BackColor, NumberOfColors, etc. 
    5. Save the theme and load it in your application.

    If you want to override the theme settings, you can take a look at the following code snippet how to achieve it: 
    void radListView1_VisualItemFormatting(object sender, ListViewVisualItemEventArgs e)
    {
        if (e.VisualItem.Selected == true)
        {
            e.VisualItem.SetThemeValueOverride(LightVisualElement.BackColorProperty, Color.Aquamarine, "ContainsMouse.MouseOver.IsHotTracking.Current.Selected");
            e.VisualItem.SetThemeValueOverride(LightVisualElement.NumberOfColorsProperty, 1, "ContainsMouse.MouseOver.IsHotTracking.Current.Selected");
     
            e.VisualItem.SetThemeValueOverride(LightVisualElement.BackColorProperty, Color.Transparent, "Selected");
            e.VisualItem.SetThemeValueOverride(LightVisualElement.NumberOfColorsProperty, 1, "Selected");
        }
        else
        {
            e.VisualItem.ResetValue(LightVisualElement.BackColorProperty, Telerik.WinControls.ValueResetFlags.Local);
            e.VisualItem.ResetValue(LightVisualElement.NumberOfColorsProperty, Telerik.WinControls.ValueResetFlags.Local);
            e.VisualItem.ResetValue(LightVisualElement.GradientStyleProperty, Telerik.WinControls.ValueResetFlags.Local);
        }
    }

    In the attachments you can find sample demo demonstrating how to load custom theme and override the setting and a gif showing how to modify the theme using Visual Style Builder. 

    I hope this information helps. Should you have further questions I would be glad to help.

    Regards,
    Ralitsa
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. KTK
    KTK avatar
    11 posts
    Member since:
    Oct 2013

    Posted 26 Jan in reply to Ralitsa Link to this post

    Adding element states in Visual builder is neat thing I didnt know and exactly what I needed.

    Thank you very much!

Back to Top
UI for WinForms is Visual Studio 2017 Ready