RadMenu - Metro Skin issue with Seperator

15 posts, 0 answers
  1. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 11 Nov 2013 Link to this post

    I have a radmenu with SiteMap source and I am trying to show the seperator in certain places. I have code and also style to show them but it's not showing property in Metro skin. It shows fine in other skin. What's going on?
    protected void RadMenu1_ItemDataBound(object sender, Telerik.Web.UI.RadMenuEventArgs e)
           {
     
               if (e.Item.Level == 1 && e.Item.Value == "Units")
               {
                   Telerik.Web.UI.RadMenuItem separator = new Telerik.Web.UI.RadMenuItem();
                   separator.IsSeparator = true;
     
                   Telerik.Web.UI.RadMenuItem itm = (Telerik.Web.UI.RadMenuItem)e.Item;
                   itm.Owner.Items.Insert(e.Item.Index + 1, separator);
               }
     
           }
    <style type="text/css">
            /* <Separators> */
     
     .rmSeparator  {
                height: 1px !important;
                margin: 1px 0 0 !important;
                width: 25px !important;
                background-color: #A8A8A8 !important;
            }
        </style>
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 14 Nov 2013 Link to this post

    Hello Vijaianand,

    I tested the issue that you describe but I am not quite sure what is the appearance that you are trying to achieve. Attached to this post you can find the look that I get from my side (as well as the code that I am currently using for testing purpose). Lem know if this is what you get from your side and if I am missing something.

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 14 Nov 2013 Link to this post

    That's what I am exactly getting. See the attached. But aren't we suppose to get the link through the full width of the menu?
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 19 Nov 2013 Link to this post

    Hi Vijaianand,

    Try using the following css class selectors instead and check if you get the desired look of the control:
    <style type="text/css" media="screen">
           .rmSeparator {
               margin-left: 0px;
               width: 25px;
               background-color: #A8A8A8;
               height: 1px;
           }
     
           div.RadMenu_Metro .rmSeparator .rmText {
               background-color: #A8A8A8;
           }
       </style>

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  6. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 19 Nov 2013 Link to this post

    Nope it didn't work.
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 19 Nov 2013 Link to this post

    Hi Vijaianand,

    For further reference I will attach again my sampel testing page and a screenshot of the result that I get from my side. Let me know hwta is different in your scenario.

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  8. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 19 Nov 2013 Link to this post

    You got for skin "Metro" not Metrotouch. It doesn't work for Metrotouch even after changing the class names in the style. Also Metrotouch skin doesn't perform similar to metro. For example, when you make a selection in the menu, Metro skin retains the selection but not Metrotouch. Looks like Metrotouch is not really working well.
  9. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 19 Nov 2013 Link to this post

    Hi Vijaianand,

    I attached a very simplified runnable page where I applied a new custom skin that is based on the BlackMetroTouch one and applied the needed styles to ge the desired look of the separators. You can also further modify the stylesheet to match your requirements.

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  10. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 20 Nov 2013 Link to this post

    I tried taking some code from the css file in the sample but nothing. it doesn't work for metrotouch skin at all. 
  11. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 20 Nov 2013 Link to this post

    I am talking about just MetroTouch not BlackMetroTouch.
  12. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 21 Nov 2013 Link to this post

    Hello Vijaianand,

    My apologies for that. Attached to this post you can find a css file that you can use instead of the BalackMetroTouch skin file that I previously sent you. By applying the approach described in the previus post and the skin file in this one You can easily get the desired results.

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  13. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 21 Nov 2013 Link to this post

    Kate

    Isn't the css part of the skin dll already and should work as expected when I apply the skin to the RadMenu? Why do I have to apply it seperatly.

    Vijai
  14. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 25 Nov 2013 Link to this post

    Hello Vijaianand, 

    In general you are correct that the skin is part of the dll assembly file. However, currently it seems that there is an issue with the skins that I sent you and the separators in the RadMenu and in order to workaround it and get the desired appearance you can use it as a separate skin. 

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  15. Vijaianand
    Vijaianand avatar
    82 posts
    Member since:
    Jul 2012

    Posted 27 Nov 2013 Link to this post

    I checked my code when I applied MetroTouch skin for the RadMenu and only see RadMenu_MetroTouch as class names not MetroTouchS as its in the css file you attached. So surely its not going to work. I changed the class names to metrotouch and no luck. There is some missing piece for the separator to show up properly in the Metrotouch Skin.
  16. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Dec 2013 Link to this post

    Hello Vijaianand,

    Indeed currently we experience some issues with the separators of the RadMenu is some of the skins. For this reason I provided the different workarounds for the particular skins. I have already logged these in our internal system so our developers can inspect it further and resolve them. I also updated your Telerik points for reporting that.

    Regards,
    Kate
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017