مخصص ASP.NET مراقبة الحاويات

Question

كنت أحاول إنشاء عنصر تحكم مخصص يعمل تماما مثل لوحة التحكم إلا وتحيط بها عدد قليل divs هذا إلى إنشاء مربع تقريب نظرة.لم أكن قادرة على العثور على مثال عن كيفية القيام بذلك.

أنا بحاجة إلى أن تكون قادرة على وضع النص والضوابط داخل التحكم في الوصول إليه مباشرة دون الرجوع إلى لوحة (بالضبط الطريقة لوحة التحكم يعمل).

هل لدى أحدكم أي أمثلة من هذا ؟

Answer 1

وهناك طريقتان للقيام بذلك. واحد هو تنفيذ INamingContainer على جهاز التحكم عن، ويستغرق الكثير من الجهد.

والطريقة الأخرى هي أن ترث من الفريق، وتجاوز الأساليب RenderBeginTag وRenderEndTag لإضافة العلامات المخصصة. هذا أمر سهل.

public class RoundedCornersPanel : System.Web.UI.WebControls.Panel
{
    public override RenderBeginTag (HtmlTextWriter writer)
    {
        writer.Write("Your rounded corner opening markup");
        base.RenderBeginTag(writer);
    }

    public override RenderEndTag (HtmlTextWriter writer)
    {
        base.RenderEndTag(writer);
        writer.Write("Your rounded corner closing markup");                     
    }
}

Answer 2

وهناك بالفعل عدد غير قليل من الإجابات هنا، ولكن أردت فقط أن لصق تنفيذ أبسط من ذلك دون وراثة من الدرجة الفريق. حتى هنا المثل:

using System.ComponentModel;
using System.Web.UI;
using System.Web.UI.WebControls;

[ToolboxData("<{0}:SimpleContainer runat=server></{0}:SimpleContainer>")]
[ParseChildren(true, "Content")]
public class SimpleContainer : WebControl, INamingContainer
{
    [PersistenceMode(PersistenceMode.InnerProperty)]
    [TemplateContainer(typeof(SimpleContainer))]
    [TemplateInstance(TemplateInstance.Single)]
    public virtual ITemplate Content { get; set; }

    public override void RenderBeginTag(HtmlTextWriter writer)
    {
        // Do not render anything.
    }

    public override void RenderEndTag(HtmlTextWriter writer)
    {
        // Do not render anything.
    }

    protected override void RenderContents(HtmlTextWriter output)
    {
        output.Write("<div class='container'>");
        this.RenderChildren(output);
        output.Write("</div>");
    }

    protected override void OnInit(System.EventArgs e)
    {
        base.OnInit(e);

        // Initialize all child controls.
        this.CreateChildControls();
        this.ChildControlsCreated = true;
    }

    protected override void CreateChildControls()
    {
        // Remove any controls
        this.Controls.Clear();

        // Add all content to a container.
        var container = new Control();
        this.Content.InstantiateIn(container);

        // Add container to the control collection.
        this.Controls.Add(container);
    }
}

وبعد ذلك يمكنك استخدام مثل هذا:

<MyControls:SimpleContainer
    ID="container1"
    runat="server">
    <Content>
        <asp:TextBox
            ID="txtName"
            runat="server" />

        <asp:Button
            ID="btnSubmit"
            runat="server"
            Text="Submit" />
    </Content>
</MyControls:SimpleContainer>

ومن codebehind يمكنك أن تفعل أشياء من هذا القبيل:

this.btnSubmit.Text = "Click me!";
this.txtName.Text = "Jack Sparrow";

Answer 3

وإنشاء فئة يرث System.Web.UI.Control، وoverrride طريقة التقديم (HtmlTextWriter). في هذه الطريقة، وتجعل المحيطة به بداية، ثم تقدم للأطفال (RenderChildren)، ثم تقدم علامات نهاية.

protected override void Render ( HtmlTextWriter output )
{
  output.Write ( "<div>" );
  RenderChildren ( output );
  output.Write ( "</div>" );
}

ويتحقق

وتدوير زوايا وعادة ما تستخدم CSS وركن الصور للأعلى يسار، أعلى يمين، أسفل الزوايا اليمنى والسفلية. يمكن أن يتم ذلك باستخدام 4 عناصر div المدمجة، بوصفها طبقات، ولكل منها صورة زاوية واحدة كما صورة خلفيتها.

Answer 4

ومشروع القانون أن يكون شيئا قد تهمك: لوحة منحنى الحاويات - أحد ASP صافي مخصص تحكم الكتلة . أنا متأكد من أنك يمكن أن تقوم به مع رمز ولديهم السلوك والشكل الذي تريد.

Answer 5

إذا كنت لا تريد أن ترث مباشرة من WebControl بدلا من لوحة، وأسهل طريقة للقيام بذلك هي لتزيين الطبقة مع [ParseChildren(false)] السمة. على الرغم من أن للوهلة الأولى أن هذا قد يوحي بأن كنت لا تريد لتحليل أطفال، ما false يشير في الواقع هو أنك لا تريد أن يعامل الأطفال من الخصائص. بدلا من ذلك، تريد لهم أن تعامل على أنها الضوابط.

وباستخدام هذه السمة، وتحصل تقريبا جميع وظائف من خارج منطقة الجزاء:

[ToolboxData("<{0}:RoundedBox runat=server></{0}:RoundedBox>")]
[ParseChildren(false)]
public class RoundedBox : WebControl, INamingContainer
{
    public override void RenderBeginTag(HtmlTextWriter writer)
    {
        writer.Write("<div class='roundedbox'>");
    }

    public override void RenderEndTag(HtmlTextWriter writer)
    {
        writer.Write("</div>");
    }
}

وهذا سوف يسمح لك لإضافة عناصر تحكم RoundedBox إلى صفحاتك، وإضافة الأطفال (الضوابط إما asp.net أو أتش تي أم أل الخام) التي سيتم تقديمها داخل شعبة بك.

وبطبيعة الحال، سوف تضاف المغلق أسلوب الطبقة roundedbox بشكل صحيح.

Answer 6

فقط شيء آخر يمكنك استخدام ، هناك تقريب الزاوية موسع في ASP.Net ajax toolkit.

وأنا أعلم أنها ليست بالضبط ما طلبته ولكن لم يكن لديك لكتابة أي رمز مخصص.

على أمل أن يساعد!

Answer 7

ونظرت إلى هذا السؤال لأنني أردت أن إنتاج لوحة تخطيط العمود 2. (ليس تماما ولكن في مثال أبسط بكثير من ما احتاجه أنا تقاسم الحل الذي أنا أنهى باستخدام:.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Syn.Test
{
    [DefaultProperty("Text")]
    [ToolboxData("<{0}:MultiPanel runat=server></{0}:MultiPanel>")]
    [ParseChildren(true)]
    [PersistChildren(false)]
    public class MultiPanel : WebControl, INamingContainer
    {
        public ContentContainer LeftContent { get; set; }

        public ContentContainer RightContent { get; set; }

        protected override void CreateChildControls()
        {
            base.CreateChildControls();
        }

        protected override void Render(HtmlTextWriter output)
        {
            output.AddStyleAttribute("width", "600px");
            output.RenderBeginTag(HtmlTextWriterTag.Div);

            output.AddStyleAttribute("float", "left");
            output.AddStyleAttribute("width", "280px");
            output.AddStyleAttribute("padding", "10px");
            output.RenderBeginTag(HtmlTextWriterTag.Div);
            LeftContent.RenderControl(output);
            output.RenderEndTag();

            output.AddStyleAttribute("float", "left");
            output.AddStyleAttribute("width", "280px");
            output.AddStyleAttribute("padding", "10px");
            output.RenderBeginTag(HtmlTextWriterTag.Div);
            RightContent.RenderControl(output);
            output.RenderEndTag();

            output.RenderEndTag();
         }
    }

    [ParseChildren(false)]
    public class ContentContainer : Control, INamingContainer
    {
    }
}

وهذه القضية لا يزال لدي هو التحسس؛ أليس العمل لفي هذا السيناريو، فإنه لا تشير اليسار والعلامات المحتوى اليمين.

Answer 8

public class myCustomPanel : Panel
{
    public override void RenderBeginTag(HtmlTextWriter writer)
    {
        writer.AddAttribute(HtmlTextWriterAttribute.Class, "top_left_corner");
        writer.RenderBeginTag(HtmlTextWriterTag.Div);
            base.RenderBeginTag(writer);
    }

    public override void RenderEndTag(HtmlTextWriter writer)
    {
            base.RenderEndTag(writer);
        writer.RenderEndTag();
    }

}