Ext.NET-WebForm之TreePanel组件
开启VS2017创建WebForm项目
打开NuGet搜索Ext.NET并安装
安装后可见
还自动帮我们创建了一个页面和文件夹项
打开自动添加的页面Ext.NET.Default.aspx，运行项目出错了，程序集Newtonsoft.Json找不到，估计是这个页面引用了这个第三方json解析包，而你还没引进项目
打开Nuget包管理器，搜索Newtonsoft.Json, 并安装。
发现已经按照了，但版本有更新，那就更新一些吧。。
更新完后，有个警告，先不管，在运行一下页面
可以显示了，但页面好像丢失CSS，很难看。
经过多次刷新和等待，终于页面显示正常了，原因是该页面引用了外站的CSS，所以加载慢了
以上算是Ext.NET WebForm入个门吧，现在我们加入主题—— TreePanel组件示例
Ext.NET 没有设计视图界面，所以一切都是蒙拐骗，做好心理准备就行。
添加一个WebForm新页面，aspx页面内容如下
然后再后置代码cs文件里添加动态创建TreePanel组件
整体结构
完整页面 WebForm1.aspx.cs
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using Ext.Net; namespace WebApplication1 { public partial class WebForm1 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { Ext.Net.TreePanel tree = new Ext.Net.TreePanel(); this.PlaceHolder1.Controls.Add(tree); tree.ID = "TreePanel1"; tree.Width = Unit.Pixel(300); tree.Height = Unit.Pixel(450); tree.Icon = Icon.BookOpen; tree.Title = "Catalog"; tree.AutoScroll = true; Ext.Net.Button btnExpand = new Ext.Net.Button(); btnExpand.Text = "Expand All"; btnExpand.Listeners.Click.Handler = tree.ClientID + ".expandAll();"; Ext.Net.Button btnCollapse = new Ext.Net.Button(); btnCollapse.Text = "Collapse All"; btnCollapse.Listeners.Click.Handler = tree.ClientID + ".collapseAll();"; Toolbar toolBar = new Toolbar(); toolBar.ID = "Toolbar1"; toolBar.Items.Add(btnExpand); toolBar.Items.Add(btnCollapse); tree.TopBar.Add(toolBar); StatusBar statusBar = new StatusBar(); statusBar.ID = "StatusBar1"; statusBar.AutoClear = 1000; tree.BottomBar.Add(statusBar); tree.Listeners.ItemClick.Handler = statusBar.ClientID + ".setStatus({text: 'Node Selected: <b>' + record.data.text + '</b>', clear: false});"; tree.Listeners.ItemExpand.Handler = statusBar.ClientID + ".setStatus({text: 'Node Expanded: <b>' + item.data.text + '</b>', clear: false});"; tree.Listeners.ItemExpand.Buffer = 30; tree.Listeners.ItemCollapse.Handler = statusBar.ClientID + ".setStatus({text: 'Node Collapsed: <b>' + item.data.text + '</b>', clear: false});"; tree.Listeners.ItemCollapse.Buffer = 30; Ext.Net.Node root = new Ext.Net.Node() { Text = "Composers" }; root.Expanded = true; tree.Root.Add(root); List<Composer> composers = this.GetData(); foreach (Composer composer in composers) { Ext.Net.Node composerNode = new Ext.Net.Node() { Text = composer.Name, Icon = Icon.UserGray }; root.Children.Add(composerNode); foreach (Composition composition in composer.Compositions) { Ext.Net.Node compositionNode = new Ext.Net.Node() { Text = composition.Type.ToString() }; composerNode.Children.Add(compositionNode); foreach (Piece piece in composition.Pieces) { Ext.Net.Node pieceNode = new Ext.Net.Node() { Text = piece.Title, Icon = Icon.Music, Leaf = true }; compositionNode.Children.Add(pieceNode); } } } } public class Composer { public Composer(string name) { this.Name = name; } public string Name { get; set; } private List<Composition> compositions; public List<Composition> Compositions { get { if (this.compositions == null) { this.compositions = new List<Composition>(); } return this.compositions; } } } public class Composition { public Composition() { } public Composition(CompositionType type) { this.Type = type; } public CompositionType Type { get; set; } private List<Piece> pieces; public List<Piece> Pieces { get { if (this.pieces == null) { this.pieces = new List<Piece>(); } return this.pieces; } } } public class Piece { public Piece() { } public Piece(string title) { this.Title = title; } public string Title { get; set; } } public enum CompositionType { Concertos, Quartets, Sonatas, Symphonies } public List<Composer> GetData() { Composer beethoven = new Composer("Beethoven"); Composition beethovenConcertos = new Composition(CompositionType.Concertos); Composition beethovenQuartets = new Composition(CompositionType.Quartets); Composition beethovenSonatas = new Composition(CompositionType.Sonatas); Composition beethovenSymphonies = new Composition(CompositionType.Symphonies); beethovenConcertos.Pieces.AddRange(new List<Piece> { new Piece{ Title = "No. 1 - C" }, new Piece{ Title = "No. 2 - B-Flat Major" }, new Piece{ Title = "No. 3 - C Minor" }, new Piece{ Title = "No. 4 - G Major" }, new Piece{ Title = "No. 5 - E-Flat Major" } }); beethovenQuartets.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Six String Quartets" }, new Piece{ Title = "Three String Quartets" }, new Piece{ Title = "Grosse Fugue for String Quartets" } }); beethovenSonatas.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Sonata in A Minor" }, new Piece{ Title = "sonata in F Major" } }); beethovenSymphonies.Pieces.AddRange(new List<Piece> { new Piece{ Title = "No. 1 - C Major" }, new Piece{ Title = "No. 2 - D Major" }, new Piece{ Title = "No. 3 - E-Flat Major" }, new Piece{ Title = "No. 4 - B-Flat Major" }, new Piece{ Title = "No. 5 - C Minor" }, new Piece{ Title = "No. 6 - F Major" }, new Piece{ Title = "No. 7 - A Major" }, new Piece{ Title = "No. 8 - F Major" }, new Piece{ Title = "No. 9 - D Minor" } }); beethoven.Compositions.AddRange(new List<Composition>{ beethovenConcertos, beethovenQuartets, beethovenSonatas, beethovenSymphonies }); Composer brahms = new Composer("Brahms"); Composition brahmsConcertos = new Composition(CompositionType.Concertos); Composition brahmsQuartets = new Composition(CompositionType.Quartets); Composition brahmsSonatas = new Composition(CompositionType.Sonatas); Composition brahmsSymphonies = new Composition(CompositionType.Symphonies); brahmsConcertos.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Violin Concerto" }, new Piece{ Title = "Double Concerto - A Minor" }, new Piece{ Title = "Piano Concerto No. 1 - D Minor" }, new Piece{ Title = "Piano Concerto No. 2 - B-Flat Major" } }); brahmsQuartets.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Piano Quartet No. 1 - G Minor" }, new Piece{ Title = "Piano Quartet No. 2 - A Major" }, new Piece{ Title = "Piano Quartet No. 3 - C Minor" }, new Piece{ Title = "Piano Quartet No. 3 - B-Flat Minor" } }); brahmsSonatas.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Two Sonatas for Clarinet - F Minor" }, new Piece{ Title = "Two Sonatas for Clarinet - E-Flat Major" } }); brahmsSymphonies.Pieces.AddRange(new List<Piece> { new Piece{ Title = "No. 1 - C Minor" }, new Piece{ Title = "No. 2 - D Minor" }, new Piece{ Title = "No. 3 - F Major" }, new Piece{ Title = "No. 4 - E Minor" } }); brahms.Compositions.AddRange(new List<Composition>{ brahmsConcertos, brahmsQuartets, brahmsSonatas, brahmsSymphonies }); Composer mozart = new Composer("Mozart"); Composition mozartConcertos = new Composition(CompositionType.Concertos); mozartConcertos.Pieces.AddRange(new List<Piece> { new Piece{ Title = "Piano Concerto No. 12" }, new Piece{ Title = "Piano Concerto No. 17" }, new Piece{ Title = "Clarinet Concerto" }, new Piece{ Title = "Violin Concerto No. 5" }, new Piece{ Title = "Violin Concerto No. 4" } }); mozart.Compositions.Add(mozartConcertos); return new List<Composer> { beethoven, brahms, mozart }; } } }
运行查看
