|
關(guān)于Web開(kāi)發(fā)上面UI布局的問(wèn)題，我上次介紹了一個(gè)可以自動(dòng)適應(yīng)輸入內(nèi)容寬度的TextBox控件，它可以解決在布局時(shí)預(yù)留控件大小和用戶(hù)數(shù)入內(nèi)容多少上的矛盾。但是由于那個(gè)控件被限制了只能做為單行輸入使用:(，在輸入大塊文本時(shí)就力不從心了，那么就再做一個(gè)可自動(dòng)適應(yīng)高度的TextBox。
原理和那個(gè)適應(yīng)寬度的TextBox查不多，只是這個(gè)反而更加簡(jiǎn)單，因?yàn)樵诟叨确较蛏显鲩L(zhǎng)不會(huì)破壞頁(yè)面的整體布局效果(寬度上的如果在頁(yè)內(nèi)會(huì)擠走別的元素的)，所以就不需要使用Agent TextBox來(lái)作為實(shí)際錄入的容器了，直接把<TextArea>增高就行了。 響應(yīng)onpropertychange事件，同步內(nèi)容和<TextArea>的高度。當(dāng)然如果完全根據(jù)內(nèi)容增高可能也會(huì)因?yàn)閮?nèi)容太多而變得難看，就設(shè)置了一個(gè)最大高度限制屬性。控件效果如下：
 #region 附 AutoTextBox 控件源碼  using System; using System.Web.UI; using System.Web.UI.WebControls; using System.ComponentModel; namespace WebExcel.UI.WebControls  { /// <summary> /// Summary description for AutoLengthTextBox.  /// </summary> [DefaultProperty("Text"), ToolboxData("<{0}:AutoTextArea runat=server></{0}:AutoTextArea>")] public class AutoTextArea : System.Web.UI.WebControls.TextBox { [DefaultValue(200)] public int MaxHeight { get { object obj = ViewState["MaxHeight"]; return obj == null ? 200 : (int)obj; } set { ViewState["MaxHeight"] = value; } } [DefaultValue(60)] public int MinHeight { get { object obj = ViewState["MinHeight"]; return obj == null ? 60 : (int)obj; } set { ViewState["MinHeight"] = value; } } protected override void OnPreRender(EventArgs e) { this.Attributes["minHeight"] = this.MinHeight.ToString(); if ( this.Height == Unit.Empty ) { this.Height = this.MinHeight; } else { this.Height = (int)Math.Max(this.MinHeight, this.Height.Value); } base.OnPreRender (e); } /// <summary> /// Render this control to the output parameter specified. /// </summary> /// <param name="output"> The HTML writer to write out to </param> protected override void Render(HtmlTextWriter output) { string strCode; if ( this.MaxHeight <= 0 ) { strCode = "this.style.height=Math.max(this.minHeight,this.scrollHeight)+(this.offsetHeight-this.clientHeight)"; } else { strCode = "this.style.height=(this.scrollHeight>200)?200:Math.max(this.minHeight,this.scrollHeight)+(this.offsetHeight-this.clientHeight)"; } base.Attributes["onpropertychange"] = strCode; // base.Attributes["onfocus"] = "this.height=this.height"; if ( base.Rows == 0 ) { base.Rows = 1; } base.TextMode = TextBoxMode.MultiLine; base.Render(output); } } } #endregion posted on 2004-12-29 00:49 birdshome 閱讀(1947) 評(píng)論(10) 編輯 收藏 所屬分類(lèi): Asp.net控件開(kāi)發(fā) |
|
|
來(lái)自： kommy > 《05.PL(呈現(xiàn)層)》
