Panel
Часто бывает нужно вставить элемент управления в точно определенное место страницы. Например, объединим два предыдущих примера:
<%@ Page Language="C#" %> <%@ import Namespace="System.Drawing" %> <script runat="server">
void Page_Load() {
Label ShopNews = new Label(); ShopNews.Text = "Новости торговой площадки"; ShopNews.Font.Size=20; ShopNews.ForeColor=Color.Red; ShopNews.BackColor=Color.LightGray; ShopNews.BorderWidth=4; ShopNews.BorderStyle=BorderStyle.Groove; ShopNews.Height=50; ShopNews.Width=500;
frmDemo.Controls.Add(ShopNews);
if (Page.IsPostBack) lblMessage.Text = "Вы выбрали " + Category.SelectedItem.Value; }
</script> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Выбор категории товаров</title> </head> <body> <br/> <form id="frmDemo" runat="server"> Выберите категорию товаров<br /> <asp:DropDownList id="Category" runat="server"> <asp:ListItem> Компьютеры </asp:ListItem > <asp:ListItem >Принтеры</asp:ListItem > <asp:ListItem > Комплектующие </asp:ListItem > <asp:ListItem Selected="true"> Мониторы </asp:ListItem > <asp:ListItem > Компакт-диски</asp:ListItem > </asp:DropDownList > <br/> <input type="Submit" value="Выбрать"> <br/><br/> <asp:Label id="lblMessage" runat="server"/> </form> </body> </html>
Рис. 3.2.
Эта страница работает не так, как нам хотелось. Текст оказался после выпадающего списка, хотя логичней было бы, чтобы текст шел в начале. В HTML для этого используют элемент разметки <DIV> — стандартный контейнер. Его аналог в ASP .NET:
— <asp:Panel>.
Чтобы заставить метку отображаться перед списком, необходимо поместить перед DropDownList объект Panel:
<asp:Panel ID="Panel1" runat="server"></asp:Panel><br />
после чего вызывать метод Controls.Add(...) от этого объекта:
Panel1.Controls.Add(ShopNews);
Рис. 3.3.
Свойство HorizontalAlign элемента Panel полезно, если нужно установить выравнивание содержащихся в нем элементов управления. Поменяем код в предыдущем примере:
<asp:Panel ID="Panel1" runat="server" HorizontalAlign="Center" width=500 />
Текст теперь размещается в центре метки.
Булевское свойство Wrap элемента Panel заставляет переносить текст на новую строку, если оно установлено, или расширять раздел, когда текст не помещается в одну строку, если оно не установлено.
Если в программе установить свойство Visible панели в False, можно сделать невидимыми все элементы, которые в нем находятся. Стили, установленные в панели, наследуются всеми вложенными элементами.
Новая возможность в ASP .NET 2.0 — задавать для Panel полосы прокрутки, как бы имитируя встроенное в страницу окно. Это делается с помощью свойства ScrollBars. Он может принимать следующие значения: None, Both, Vertical, Horizontal, Auto.
Если вы установите его в Auto, полосы прокрутки появятся, когда содержимое панели не умещается в ее видимые размеры:
<asp:Panel ID="Panel1" runat="server" Height="140px" Width="494px" ScrollBars="Auto" HorizontalAlign="Left"> </asp:Panel> protected void Page_Load(object sender, EventArgs e) { for(int i=0;i<100;i++) { Literal l=new Literal(); l.Text = "Мой дядя самых честных правил,<br>Когда не в шутку занемог<br><br>"; this.Panel1.Controls.Add(l); } }
Реализуется такая возможность с помощью атрибута css overflow:
<div id="Panel1" style="height:140px;width:494px; overflow:auto;text-align:left;">
так что подобного поведения можно было добиться, просто изменив стиль. Но ведь не все из нас знают так хорошо css, чтобы иметь понятие об overflow.
Ставить свойство ScrollBars в Vertical или Horizontal я вам не рекомендую. Генерируется overflow-x, а это не работает в браузере Opera 9.0. overflow не поддерживается Opera 6.
Вертикальную полосу прокрутки можно установить и слева. Для этого поменяйте свойство Direction в RightToLeft.
Для Panel можно задать фоновую картинку с помощью свойства BackImageUrl.