패널 컨트롤은 페이지의 다른 컨트롤에 대한 컨테이너 역할을 할 수 있습니다. 포함된 컨트롤의 모양과 가시성을 제어합니다. 또한 생성된 제어 프로그래밍도 가능합니다.
패널 컨트롤의 기본 구문은 다음과 같습니다.
<asp:Panel ID= "Panel1" runat = "server"></asp:Panel>
패널 컨트롤은 WebControl 클래스에서 파생됩니다. 따라서 모든 속성, 메서드 및 이벤트를 동일하게 상속합니다. 자체 메서드나 이벤트가 없습니다. 그러나 다음과 같은 고유한 속성이 있습니다.
재산 | 설명하다 |
---|---|
뒤로이미지 URL | 패널 배경 이미지의 주소입니다. |
기본버튼 | Panel 컨트롤에 포함된 기본 단추의 식별자를 가져오거나 설정합니다. |
방향 | 패널의 텍스트 방향입니다. |
그룹화텍스트 | 텍스트를 필드로 그룹화할 수 있습니다. |
수평 정렬 | 패널의 내용을 가로로 정렬합니다. |
스크롤바 | 패널 내 스크롤 막대의 가시성과 위치를 지정합니다. |
포장하다 | 텍스트 줄 바꿈을 허용합니다. |
특정 높이와 너비, 간단한 테두리 스타일을 갖춘 스크롤 패널부터 시작해 보겠습니다. 스크롤 막대 속성은 두 개의 스크롤 막대로 설정되므로 두 스크롤 막대가 동시에 렌더링됩니다.
소스 파일에는 다음과 같은 패널 레이블 코드가 있습니다.
<asp:Panel ID="Panel1" runat="server" BorderColor="#990000" BorderStyle="Solid" Borderstyle="width:1px" Height="116px" ScrollBars="Both"> This is a scrollable panel. <br /> <br /> <asp:Button ID="btnpanel" runat="server" Text="Button" /></asp:Panel>
패널은 다음과 같이 나타납니다.
다음 예에서는 동적 콘텐츠 생성을 보여줍니다. 사용자는 패널에 생성될 레이블 컨트롤과 텍스트 상자의 수를 제공합니다. 컨트롤은 프로그래밍 방식으로 생성됩니다.
패널 속성을 변경하려면 속성 창을 사용하세요. 디자인 보기에서 컨트롤을 선택하면 속성 창에 특정 컨트롤의 속성이 표시되며 이를 입력하지 않고도 변경할 수 있습니다.
예제의 소스 파일은 다음과 같습니다.
<form id="form1" runat="server"> <div> <asp:Panel ID="pnldynamic" runat="server" BorderColor="#990000" BorderStyle="Solid" Borderstyle="width:1px" Height="150px" ScrollBars="Auto" BackColor="#CCCCFF" Font-Names="Courier" HorizontalAlign="Center"> This panel shows dynamic control generation: <br /> <br /> </asp:Panel> </div> <table> <tr> <td>No of Labels:</td> <td> <asp:DropDownList ID="ddllabels" runat="server"> <asp:ListItem>0</asp:ListItem> <asp:ListItem>1</asp:ListItem> <asp:ListItem>2</asp:ListItem> <asp:ListItem>3</asp:ListItem> <asp:ListItem>4</asp:ListItem> </asp:DropDownList> </td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td>No of Text Boxes :</td> <td> <asp:DropDownList ID="ddltextbox" runat="server"> <asp:ListItem>0</asp:ListItem> <asp:ListItem Value="1"></asp:ListItem> <asp:ListItem>2</asp:ListItem> <asp:ListItem>3</asp:ListItem> <asp:ListItem Value="4"></asp:ListItem> </asp:DropDownList> </td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td> <asp:CheckBox ID="chkvisible" runat="server" Text="Make the Panel Visible" /> </td> <td> <asp:Button ID="btnrefresh" runat="server" Text="Refresh Panel" /> </td> </tr> </table></form>
Page_Load 이벤트 뒤에 동적으로 생성된 컨트롤의 소스 코드는 다음과 같습니다.
public partial class _Default : System.Web.UI.Page{ protected void Page_Load(object sender, EventArgs e) { //make the panel visible pnldynamic.Visible = chkvisible.Checked; //generating the lable controls: int n = Int32.Parse(ddllabels.SelectedItem.Value); for (int i = 1; i <= n; i++) { Label lbl = new Label(); lbl.Text = "Label" + (i).ToString(); pnldynamic.Controls.Add(lbl); pnldynamic.Controls.Add(new LiteralControl("<br />")); } //generating the text box controls: int m = Int32.Parse(ddltextbox.SelectedItem.Value); for (int i = 1; i <= m; i++) { TextBox txt = new TextBox(); txt.Text = "Text Box" + (i).ToString(); pnldynamic.Controls.Add(txt); pnldynamic.Controls.Add(new LiteralControl("<br />")); } }}
실행되면 패널이 다음과 같이 렌더링됩니다.