Dock, some difficulties

4 posts, 0 answers
  1. André Freitas
    André Freitas avatar
    23 posts
    Member since:
    Feb 2010

    Posted 05 Feb 2010 Link to this post

    Im trying to create a dock zone, with 5 docks, and orientation horizontal, its a priority like utility, whats in the left its more important.

    Problems:

        I cant set the height of each dock, another controls will be added inside. But, in firefox, these docks get very big. To reproduce this you just need a docklayout, a dockzone (no height), 2 docks inside (no height), and orientation horizontal. The docks dont feet to the content inside, but to the page height size (??). A workaround its to change the dock height when adding controls, but its very boring to do, im not sure how many text will come from database, and im not using a monospace font.

        I do need a space between each dock, what im trying to get adding a padding in the raddock_custom, and it works very bad, first because IE draw the help lines with padding, around and far from the dock, and FF seems to be adding the padding to the help lines and the virtual dock size each time a control is dragged around.

        In a dockzone without any width, the help lines dont show, and becomes impossible to drag docks, except the last one.

    If anyone can point me a direction to solve these problems i ll be very glad.

    Regards
  2. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 10 Feb 2010 Link to this post

    Hi André,

    I tested the following page and it doesn't seem to have problems with the dock's height. The docks respect the height of the content, and the DockZone's height expands to the height of the "largest" dock.

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title></title>
        <style type="text/css">
            .RadDock
            {
                margin-right: 10px;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div>
            <telerik:RadDockLayout ID="RadDockLayout1" runat="server">
                <telerik:RadDockZone ID="RadDockZone1" runat="server" Width="700px" Orientation="Horizontal">
                    <telerik:RadDock ID="RadDock1" runat="server" Width="300px" Title="RadDock-Title">
                        <ContentTemplate>
                            <br />
                            <br />
                            <br />
                            <br />
                            <br />
                            CONTENT
                            <br />
                            <br />
                            <br />
                            <br />
                            <br />
                        </ContentTemplate>
                    </telerik:RadDock>
                    <telerik:RadDock ID="RadDock2" runat="server" Width="300px" Title="RadDock-Title">
                        <ContentTemplate>
                            Compare Telerik Silverlight suite & Microsoft Silverlight toolkit. See which are
                            the distinct advantages RadControls offer! Read moreDescribe a working Telerik Reporting
                            project that you have developed and win great prizes! Read the rules
                        </ContentTemplate>
                    </telerik:RadDock>
                </telerik:RadDockZone>
            </telerik:RadDockLayout>
        </div>
        </form>
    </body>
    </html>

    To set a spacing around the dock use margin and not padding. The following will set right margin of 10px to every dock present on the page:
    <style type="text/css">
        .RadDock
        {
            margin-right: 10px;
        }
    </style>

    If you still have problems with the height of the docks and zones please provide some sample code that will help us reproduce the problem locally.


    Regards,
    Pero
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
  3. André Freitas
    André Freitas avatar
    23 posts
    Member since:
    Feb 2010

    Posted 10 Feb 2010 Link to this post

    Putting the margin dont works well. The guide lines seems to be without any margin, and causes the entire page to change when you are dragging a control around, I do appreciate your answer anyway, and I ll keep tracking some workaround based on that.

        The problem with the height occour because the project that I was working on, dont have <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> in the master page. Thank you for that.

    Regards,
    André

  4. Pero
    Admin
    Pero avatar
    1156 posts

    Posted 15 Feb 2010 Link to this post

    Hello André,

    You can use client-script to dynamically add and remove margin from the dock's element. When the dock is placed inside a zone add and when is outside a zone remove the margin. To achieve this handle the OnClientDockPositionChanged event and use the dock.get_dockZoneID() to check whether the dock is in a zone. The dock.get_element() will return a reference to the dock's HTML element.

    In case you still cannot resolve the problem, please send us a sample project that demonstrates the issue and we will do our best to provide a solution.

    Sincerely yours,
    Pero
    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.
Back to Top