skin chooser

[Mike]

Hi,

I understand the webmail sample uses the skinchooser dropdown for telerik embedded skins.

I have now created my own skin, using your tools I have converted in into an assembly. How can I now add this new skin into the skinchooser and have it skin all the controls for which I have created styles when I select it?

Regards
Mike

Any chance of a reply on this Telerik?

[Rosen]

Hello Mike,

In order to show the custom skin in the SkinChooser you can either add it explicitly in page's init similar to the following:

protected void Page_Init(object sender, EventArgs e)
{
    var skinCombo = RadSkinManager1.GetSkinChooser();
    skinCombo.Items.Add(new RadComboBoxItem("MyCustomSkinName", "MyCustomSkinName"));
}

 
Or if you will be using RadSkinManager in many places in your app, you may consider subclassing it and override the FillSkins method. Similar to the following:

namespace MyNamespace
{
    public class MySkinManager : RadSkinManager
    {
        protected override void FillSkins(RadComboBox chooser)
        {
            base.FillSkins(chooser);
            chooser.Items.Add(new RadComboBoxItem("MyCustomSkinName"));
        }
    }
}

and a simple usage:

<%@ Register TagPrefix="custom" Namespace="MyNamespace" %>

<custom:MySkinManager runat="server" ShowChooser="true" ID="RadSkinManager1"  />

All the best,
Rosen
the Telerik team

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 Public Issue Tracking system and vote to affect the priority of the items.

[Mike]

Thank you Rosen for your reply.

However when I do this I get the error on some controls that is can't find the embedded skin 'arrow' (the name i've given to the skin). So does this mean I have to enable every single control in my application on which I'd like to implement custom skins to:

EnableEmbeddedSkins

 

="false"

If so this is a major overhead and then renders all the built-in skins useless for those controls?

 

Also even when I have enabled a few of the controls with the above property and selected the 'arrow' skin in the chooser, I'm still not getting any styles at all applied to those controls.

Here is what I have done, so you can follow:
Used the visual style builder online and created a zip file from it. Named it 'arrow'. I then ran it through the project you supply on your site to make it into an assembly and I include this in the 'Bin' folder in my project.

I have the following code in the masterpage aspx:

<arrowSkins:SkinManager runat="server" ID="RadSkinManager1" ShowChooser="true" Skin="Default" PersistenceKey="Skin" OnSkinChanged="RadSkinManager1_ChangeSkin" OnPreRender="RadSkinManager1_PreRender">                           </arrowSkins:SkinManager>

In my code behind I have the following:

    protected void Page_Init(object sender, EventArgs e)
    {
        var skinCombo = RadPanelBar1.FindItemByValue("Preference").FindControl("SkinChooser") as RadComboBox;
        skinCombo.Items.Add(new RadComboBoxItem("arrow", "arrow"));
    }


protected void RadSkinManager1_PreRender(object sender, EventArgs e)
    {
        RadComboBox skinChooser = RadPanelBar1.FindItemByValue("Preference").FindControl("SkinChooser") as RadComboBox;
        int i = 0;
        while (i < skinChooser.Items.Count)
        {
            if (skinChooser.Items[i].Text == "Black")
            {
                skinChooser.Items.Remove(skinChooser.Items[i]);
            }
            i++;
            //more conditions here
        }
    }

    protected void RadSkinManager1_ChangeSkin(object sender, EventArgs e)
    {
        try
        {
            RadSkinManager rsm = (RadSkinManager)RadPanelBar1.FindItemByValue("Preference").FindControl("RadSkinManager1");
            Profile.skin = rsm.Skin;
        }

        catch (Exception ex)
        {
            bool reThrow = false;
            if (ex != null)
            {
                reThrow = Microsoft.Practices.EnterpriseLibrary.ExceptionHandling.ExceptionPolicy.HandleException(ex, "UI Policy");
            }
            Response.Redirect("~/Protected/Error.aspx");
        }
    }

If I don't try to implement my custom skin then all the embedded skins work fine. What I wanted is to make use of both the embedded skins and also any custom skins we may develop.

Please advise.

Regards
Mike

[Rosen]

Hello Mike,

Indeed in order to use custom skins you should set EnableEmbeddedSkins to false. This can be set through webconfig for all of the RadControls as shown in this help article.

Unfortunately when set to true you would not be able to use the embedded skins directly. However you still can reference them through RadStyleSheetManager manually. For example:

<telerik:RadStyleSheetManager runat="server">
    <StyleSheets>
        <telerik:StyleSheetReference Assembly="TelerikSkins" Name="TelerikSkins.mySkin.Menu.mySkin.css" />
        <telerik:StyleSheetReference Assembly="TelerikSkins" Name="TelerikSkins.mySkin.ComboBox.mySkin.css" />
        <telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Default.Menu.Default.css" />
        <telerik:StyleSheetReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Skins.Default.ComboBox.Default.css" />
    </StyleSheets>
</telerik:RadStyleSheetManager>

Note that you may consider loading them dynamically instead.

I hope this helps.

Best wishes,
Rosen
the Telerik team

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 Public Issue Tracking system and vote to affect the priority of the items.