HT for Web 风格手册

索引

概述

HT for Web默认具有一套整体性的风格效果，在各种组件中保持一致的颜色，尺寸和操作习惯， 但用户客户根据具体使用需要进行定制，改变风格以适应不同项目或行业的效果需求。

配置

改变HT系统默认属性，需要通过全局的htconfig变量名指定，HT系统只在初始化时读取htconfig的配置信息， 因此该属性必须在引入ht.js包之前初始化好，运行状态时修改htconfig变量不会再起作用，示例代码如下：

<script>
    htconfig = {
        Color: {          
            label: '#000',
            highlight: '#1ABC9C',           
        },
        Default: {
            toolTipDelay: 100,
            toolTipContinual: true
        },                
        Style: {
            'select.color': '#E74C3C',
            'select.width': 3
        }
    };
</script>           
<script src="ht.js"></script>

可配置的参数分为三大类：

ht.Color

ht.Color是为简化颜色主题自定义而抽象的一组颜色属性集，HT系统中所有颜色都取之于这组颜色集， 每个属性对应一到多个ht.Default，ht.Style或预定义矢量图片中的具体属性。

ht.Default.listViewSelectBackground和ht.Default.treeViewSelectBackground初始值都由ht.Color.highlight值决定的，因此：

以下是ht.Color每个颜色对应的具体属性

ht.Default

ht.Default定义了所有组件的默认参数值，命名规范以组件名+属性名的结合方式，例如树组件TreeView的行线是否显示属性rowLineVisible， 该属性的默认值定义在ht.Default.treeViewRowLineVisible上，因此可通过treeView.setRowLineVisible(true)改变具体组件实例， 也可通过配置ht.Default.treeViewRowLineVisible属性达到全局修改所有TreeView实例的效果。

ht.Default中出了定义了默认参数外，还包含很多工具函数，以下例子是对所有属性参数，以及工具函数使用的描述说明：

ht.Style

ht.Style定义了所有在GraphView和Graph3dView组件上显示的图元的style默认属性，创建Node和Edge这些图元实例对象时， 其对象自身的style属性为空，调用getStyle(name)函数时，如果该属性未设置，则HT会通过ht.Style的全局定义的默认值获取信息， 如果通过setStyle(name, value)的方式设置了具体对象属性后，getStyle(name)则会返回具体被设置的属性信息。

以下为ht.Style所有预定义的参数属性描述说明：

欢迎交流 service@hightopo.com