Professional Web Applications Themes

ASP.NET Custom WebControl Absolute Positioning - ASP.NET Building Controls

Hi, I'm currently in the process of building a custom webcontrol. I nearly finished it, however one thing is a mystery to me: how do i enable the control to support absolute positioning? Thanks in advance, Nick Goloborodko...

  1. #1

    Default ASP.NET Custom WebControl Absolute Positioning

    Hi,

    I'm currently in the process of building a custom webcontrol. I nearly
    finished it, however one thing is a mystery to me: how do i enable the
    control to support absolute positioning?

    Thanks in advance,
    Nick Goloborodko
    Nick Goloborodko Guest

  2. #2

    Default Re: ASP.NET Custom WebControl Absolute Positioning

    This is more a HTML/CSS question. You could define a properties which
    expose the Control's absolute position, and let your control render the
    css tyle "position: absolute" and some css offset attributes (like
    "top: 10px; left: 10px") based on those properties.

    However, it is arguably a bad idea to absolutely position everything.

    Wilco Bauwer Guest

  3. #3

    Default Re: ASP.NET Custom WebControl Absolute Positioning

    Hi, thanks for the reply :) However that only answers part of my question.
    As far as I'm aware, WebForms support two types of layout: Flow Layout and
    Grid Layout. Flow layout is nice and straight forward - all of the
    components are positioned by the use of tables, div etc. However Grid
    Layout is using th html stlye attribute of components to absolutly position
    them.

    My Component is nothing more than 2 divs, one insde another which funtion
    like progress bar (with a little JavaScript magic). When i add the
    component to the tool box, i can drag it out fine onto a WebForm and
    position it using GridLayout into a position (we'll i do know that this is
    somewhat a bad practice, which i do not normally use, but since i am
    planning to realise my custom WebControl to the comunity - this is kind of
    neccecary) the Control is displayed fine in the designer, but when i launch
    my form, all of my elements are moved to the TOP Left corner of the page
    (as can be expected if Flow Layout was used).

    Please give me a clue :)

    Kind regards,
    Nick Goloborodko
    Nick Goloborodko Guest

  4. #4

    Default Re: ASP.NET Custom WebControl Absolute Positioning

    Hi Nick,

    I think the problem you're meeting should be divided into two parts:

    1. The design-time jobs for your control:
    The "GridLayOut" setting is for VS.NET IDE use at design-time more than
    page in runtime. When the page is set to "GridLayout", each control draged
    from toolbox onto the webform will contains absolute postion attributes in
    the "style" attribute. And when they're moved , the values will be
    synchronized by IDE.

    eg:

    <cc1:PositionControl id="Control1" style="Z-INDEX: 101; LEFT: 264px;
    POSITION: absolute; TOP: 112px" runat="server"...... >

    This won't happen when using the "FlowLayout".

    2. The runtime jobs for your control:
    Though the VS.NET IDE will help manage these position attributes at
    deign-time(using GridLayout). This dosn't means that our webcontrol will
    also display as absolute postion on the web page at runtime. This is
    because the web page is rendered as Html elements and displaying in
    clientside browser, if you want to make your custom control also located on
    page by absolute positino, you need to render the absolute postion
    styles(css styls) when rendering the html content of your web control. For
    example:

    the TextBox control(with absolute position) will render as the following
    html elements:

    <input name="TextBox1" type="text" id="TextBox1"
    style="height:40px;width:256px;Z-INDEX: 102; LEFT: 304px; POSITION:
    absolute; TOP: 40px" />

    Note that the "style" value is different from the "style" in aspx page, we
    need to manually set these css attributes in our control's code. However,
    ASP.NET design-time has provided us the ability to retrieve the design-time
    position attributes' values by providing a custom ControlDesigner. Here is
    a blog article which has mentioned how to get this value :

    How to interact with Style["LEFT"] and Style["TOP"] of the WebControl
    during design time
    [url]http://blog.joycode.com/felix/articles/39633.aspx?Pending=true[/url]

    For other reference about applying styles for asp.net controls you can have
    a look at the MSDN's webcontrol develpment section:

    #Styles in Server Controls
    [url]http://msdn.microsoft.com/library/en-us/cpguide/html/cpconstylesinservercont[/url]
    rols.asp?frame=true

    Hope helps. Thanks.

    Steven Cheng
    Microsoft Online Support

    Get Secure! [url]www.microsoft.com/security[/url]
    (This posting is provided "AS IS", with no warranties, and confers no
    rights.)




    Steven Cheng[MSFT] Guest

Similar Threads

  1. Custom Controls and Absolute Positioning
    By Rick Strahl [MVP] in forum ASP.NET Building Controls
    Replies: 1
    Last Post: December 11th, 09:22 AM
  2. CSS - Margins and absolute positioning don't worktogether
    By Polly Anna 22 in forum Macromedia Dynamic HTML
    Replies: 5
    Last Post: February 4th, 11:26 PM
  3. Absolute positioning resizes incorrectly
    By Mangia in forum ASP.NET Building Controls
    Replies: 0
    Last Post: May 11th, 04:01 AM
  4. I guess my questions is about absolute positioning......
    By chrisdanvers@adobeforums.com in forum Adobe Acrobat Windows
    Replies: 3
    Last Post: April 8th, 08:39 PM
  5. How do I get absolute position deriving from Control instead of WebControl?
    By Teemu Keiski in forum ASP.NET Building Controls
    Replies: 3
    Last Post: July 19th, 05:16 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139