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

Styling the Editor Dialogs

9 Answers 44 Views
Visual Style Builder
This is a migrated thread and some comments may be shown as answers.
Stuart Hemming
Top achievements
Rank 2
Stuart Hemming asked on 02 Aug 2010, 03:36 PM
I'm trying to automate the registering of CSS files for a skin in an assembly and, for the most part, I've succeeded. The majority of the work is done by the following 2 methods...

public void ApplySkin(Control target)
{
    if (target == null)
    {
        return;
    }
    if (!target.Visible)
    {
        return;
    }
    if (target is ISkinnableControl)
    {
        AvailableSkin skinToUse = AvailableSkins.Find(s => s.Name == Skin);
        if (!skinToUse.IsEmbedded)
        {
            RegisterControlSkin(skinToUse, target.GetType().Name);
 
            if (target.GetType().Name == "RadEditor")
            {
                RegisterControlSkin(skinToUse, "RadWindow");
                RegisterControlSkin(skinToUse, "RadTabStrip");
                RegisterControlSkin(skinToUse, "RadGrid");
            }
        }
        //TODO: Need to have a flag on each item to determine if it is embedded or not
        ((ISkinnableControl)target).EnableEmbeddedSkins = skinToUse.IsEmbedded;
        ((ISkinnableControl)target).Skin = skinToUse.Name;
    }
    else
    {
        if (target.Controls.Count > 0)
        {
            foreach (Control child in target.Controls)
            {
                ApplySkin(child);
            }
        }
    }
}
void RegisterControlSkin(AvailableSkin Skin, string Control)
{
    RadStyleSheetManager mgr = Page.Master.FindControl("RadStyleSheetManager1") as RadStyleSheetManager;
 
    string controlName = Control;
    if (Control.StartsWith("Rad"))
    {
        controlName = Control.Remove(0, 3);
    }
    if (!skinnedControls.Contains(controlName))
    {
        string fileName = String.Format("{0}.{1}.{2}.{1}.css", Skin.Assembly, Skin.Name, controlName);
        StyleSheetReference skinRef = new StyleSheetReference(fileName, Skin.Assembly);
        mgr.StyleSheets.Add(skinRef);
        skinnedControls.Add(controlName);
    }
}

What I'm struggling with ATM is skinning of the RadEditor dialogs. You'll see that the ApplySkin() method registers the CSS files for the Grid, Window and TabStrip controls which are used by the dialog, but I am seeing SS1 when I open one of the dialogs.

I suspect that the problem is that the content of the window is using a separate page source and the custom skin items aren't being registered on that page.

How do I get around this?

-- 
Stuart

9 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 03 Aug 2010, 12:24 PM
Hi Stuart,

The RadWindow based dialogs of RadEditor render their content inside IFRAME elements which are separate documents and they could not copy the styles from the parent page. For that reason we provided the DialogCssFile property, which imports the CSS styles from an external css file in the dialogs' IFRAMEs and applies formatting to the elements inside the dialogs.

You can see the following KB article for more information: Registering an external skin of RadEditor.

Best regards,
Rumen
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
0
Stuart Hemming
Top achievements
Rank 2
answered on 03 Aug 2010, 06:15 PM
OK Rumen, thanks for that.

I have a related question though.

I have a custom skin, created using Visual Style Builder and compiled up in to an assembly.

I have a non-visual control that I use on my website's page's masterpage to make sure the relevant skin's .CSS files  - as WebResources - are properly registered. How does that tie-up with what it is that the article you pointed me at requires?

-- 
Stuart
0
Stuart Hemming
Top achievements
Rank 2
answered on 04 Aug 2010, 12:44 AM
I have another question: If I'm using a custom skin, whether or not the skin files are in a DLL, I still need to set the controls inside the dialog to use UseEmbeddedSkins="false", don't I? How do I manage that?

-- 
Stuart
0
Rumen
Telerik team
answered on 05 Aug 2010, 03:48 PM
Hi Stuart,

You should set UseEmbeddedSkins="false" for the controls that you want to use custom skins.

After that create an aspx file that will be loaded by the DialogCssFile property and which will dynamically serve the css webresource files and load them in the RadEditor dialogs. See the attached file for example.

Kind regards,
Rumen
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
0
Stuart Hemming
Top achievements
Rank 2
answered on 06 Aug 2010, 10:14 AM
Rumen,

Thanks for getting back to me.

Sadly, I guess I must be too dumb to understand just what it is I'm missing when it comes to getting this to work using compiled skins.

So, I'm raising a support ticket with a sample app to see if I can get some more help. I'll refer back to this thread so don't be surprised if the support ticket lands on your desk! :-)

-- 
Stuart
0
Stuart Hemming
Top achievements
Rank 2
answered on 06 Aug 2010, 10:40 AM
Support ticket : 335937

-- 
Stuart
0
Rumen
Telerik team
answered on 09 Aug 2010, 04:22 PM
Hi Stuart,

I just answered your support ticket. If you like the provided solution you can share it with our community.

Best regards,
Rumen
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
0
Stuart Hemming
Top achievements
Rank 2
answered on 09 Aug 2010, 04:28 PM
Rumen, 

I'm just working through your solution now.

I'll report back here when I'm done.

Many thanks.

-- 
Stuart
0
Stuart Hemming
Top achievements
Rank 2
answered on 10 Aug 2010, 11:36 AM
For anyone following this thread, there a still a few issues to be sorted out, but stay tuned; we're getting there.

-- 
Stuart
Tags
Visual Style Builder
Asked by
Stuart Hemming
Top achievements
Rank 2
Answers by
Rumen
Telerik team
Stuart Hemming
Top achievements
Rank 2
Share this question
or