Ext.Net TreePanel 修改Icon图标

分类： Ext.Net2012-09-24 13:44 1779人阅读 评论(0) 收藏 举报

webformserverextassemblyxhtmlobject

1、默认icon

2、自定义icon

完整的代码，文件WebForm2.aspx中代码

[html] view plaincopy

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="ext_SMS.WebForm2" %>
  2. <%@ Import Namespace="System.Collections.Generic" %>
  3. <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head id="Head1" runat="server">
  7. <title>改变TreePanel Icon图标</title>
  8. style type="text/css">   //自定义样式
  9. .add {
  10. background-image: url(image/query.jpg) !important;
  11. }
  12. </style>
  13. </head>
  14. <body>
  15. <form id="Form2" runat="server">
  16. <ext:ResourceManager ID="ResourceManager1" runat="server" />
  17. <ext:Viewport ID="Viewport1" runat="server">
  18. <Items>
  19. <ext:BorderLayout ID="BorderLayout1" runat="server">
  20. <West>
  21. <ext:TreePanel
  22. ID="TreePanel1"
  23. runat="server"
  24. Title="Tree"
  25. Width="200"
  26. AutoHeight="true"
  27. Border="false">
  28. <Root>
  29. <ext:AsyncTreeNode Text="系统功能模块" NodeID="root" Expanded="true"   Icon="ApplicationHome">
  30. </ext:AsyncTreeNode>
  31. </Root>
  32. <Loader>
  33. <ext:PageTreeLoader RequestMethod="POST" OnNodeLoad="GetReportList" PreloadChildren="true">
  34. <EventMask ShowMask="true" Target="Parent" Msg="Loading..." />
  35. </ext:PageTreeLoader>
  36. </Loader>
  37. <Listeners>
  38. <Click Handler="if(node.isLeaf()){e.stopEvent();loadExample(node);}" />
  39. </Listeners>
  40. </ext:TreePanel>
  41. </West>
  42. <Center>
  43. <ext:TabPanel ID="Pages" runat="server" EnableTabScroll="true" />
  44. </Center>
  45. </ext:BorderLayout>
  46. </Items>
  47. </ext:Viewport>
  48. </form>
  49. </body>
  50. </html>

后台文件WebForm2.aspx.cs中代码：

[csharp] view plaincopy

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using Ext.Net;
  8. using System.Data;
  9. namespace ext_SMS
  10. {
  11. public partial class WebForm2 : System.Web.UI.Page
  12. {
  13. protected void Page_Load(object sender, EventArgs e)
  14. {
  15. }
  16. protected void GetReportList(object sender, NodeLoadEventArgs e)
  17. {
  18. string prefix = e.ExtraParams["prefix"] ?? "";
  19. if (!string.IsNullOrEmpty(e.NodeID))
  20. {
  21. for (int i = 1; i < 6; i++)
  22. {
  23. AsyncTreeNode asyncNode = new AsyncTreeNode();
  24. asyncNode.Text = prefix + e.NodeID + i;
  25. asyncNode.NodeID = e.NodeID + i;
  26. e.Nodes.Add(asyncNode);
  27. }
  28. for (int i = 6; i < 11; i++)
  29. {
  30. Ext.Net.TreeNode treeNode = new Ext.Net.TreeNode();
  31. treeNode.Text = prefix + e.NodeID + i;
  32. treeNode.NodeID = e.NodeID + i;
  33. treeNode.Leaf = true;
  34. // treeNode.Icon = Icon.Accept;         //注意此处设置不起作用
  35. treeNode.IconCls = "add";     //设置自定义样式
  36. e.Nodes.Add(treeNode);
  37. }
  38. }
  39. }
  40. }
  41. }

注意：图片位于image文件夹下，名称query.jpg

3、需要默认样式时，不设置自定义样式即可。

去掉这句：treeNode.IconCls = "add"; //设置自定义样式

时间： 2024-12-14 19:52:39

Ext.Net TreePanel 修改Icon图标的相关文章

Easyui 修改|新增jquery-easyui icon图标

修改|新增jquery-easyui icon图标 by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 修改配置文件 打开jquery-easyui-1.5.3\themes\icon.css文件,文件头部添加目标图标样式,例子: .icon{ background:url('../../icons/tabicons.png') no-repeat; width:18px; height:18px; display:inline-block; } .icon

【转】 博客园自定义样式修改标签页的icon图标

有没有发现大多数的博客园标签右上角都是一个小矿工,千篇一律没有什么特色,想不想设置一个像我一样的个性化icon图标呢? 按照以下四步你也可以实现自定义标签图标. From To 第一步:挑挑拣拣 选一张icon图标(尺寸不要太大)不然加载会很慢 如果想通过自己的图片生成favicon,可以使用这个网站: Favicon Generator. For real. 第二步:传文档 在博客园的设置界面选择文档,将你喜欢的图片上传上来 第三步:写代码 在设置中的页脚Html代码中插入以下script脚本

Flex4_Tree组件2(添加多选框、修改树图标)

1.新建AS类,用于为Tree生成复选框,及一些选择事件. package com.th.myUtils { import flash.events.Event; import flash.events.MouseEvent; import mx.controls.Alert; import mx.controls.CheckBox; import mx.controls.Tree; import mx.controls.treeClasses.TreeItemRenderer; import

[转]轻松学习Ionic （四） 修改应用图标及添加启动画面（更新官方命令行工具自动生成）

本文转自:http://blog.csdn.net/zapzqc/article/details/42237935 由于Ionic更新了命令行工具,以后修改应用图标和添加启动画面就简单了,最新方法见最下方: 应用图标: 1.在整个项目所在文件夹下创建res文件夹,里边再分别创建两个文件夹android和ios. 2.针对Android平台:将我们的要替换的启动图标放如android文件夹下.可以分别起名为:mdpi.png(48*48),hdpi(72*72).xhdpi(96*96).xxhd

Android 修改应用图标（Android Studio）

1 res\drawable 放置icon.png(此图片是你需要修改的图标,必须是png文件). 2 修改AndroidManifest.xml: android:icon="@drawable/icon". 3 编译运行即可. 参考资料 修改Android app图标(Android Studio)

bootstrap在input框中加入icon图标

<form class="form-horizontal"> <div class="form-group has-feedback"> <div class="username"> <span class="fa fa-user-circle-o fa-2x form-control-feedback"></span> <input type="te

在网页中使用icon图标：png、svg、iconfont

在写个人简历时,好多地方都要用到各式各样的icon图标,不仅是为了样式的美观,更是能够为访客提供很好的指引,比如: 放上这些图标,总比干巴巴的 ‘点击右侧进入详情’ 好⑧ (在做建立网站的时候,本来是想用svg一把梭的,简单好用,也不知道为啥突然觉得,哎,都用了这么久svg了,试试png吧:) 结果一发不可收拾,大概二十多张png图片,还没有用雪碧图,我脑壳痛) (还是建议用下面提到的svg或者iconfont+css/html吧) 方式1:png/jpg... 这个就不用多说了,放在span里

12个Icon图标资源网站

1.除了Icon以外,还有很多不错的UI设计素材. 地址:http://worldui.com/2.除了免费Icon资源下载以外,还提供Icon定制的付费服务.地址:http://dryicons.com/3.很喜欢这个icon资源站的展示方式.地址:http://www.icotrip.com/4.Icones.pro,icon资源站,每日推荐的Icon资源还不错,可以按照浏览数,下载数等查看Icon资源.地址:http://icones.pro/5.IconPNG 共收录 21372 个 图

微信小程序组件解读和分析：四、icon图标

icon图标组件说明: icon是一种图标格式,用于系统图标.软件图标等,这种图标扩展名为.icon..ico.常见的软件或windows桌面上的那些图标一般都是ICON格式的.在应用上面很多地方用到了icon图标,这样方便程序表述程序返回的操作状态,用户一眼就能看出应用返回的意思,提高用户体验,在小程序的组件提供了常用的icon图标,详细使用看下面介绍! icon图标组件用法说明: 在使用的icon的时候,使用icon标签,然后有type属性和size属性, 具体的属性看最后的属性总结,标签的