widget.xml

来自「维信SDK文档。源码要求为至少5个C或Java源码」· XML 代码 · 共 473 行

<?xml version="1.0" encoding="utf-8"?>
 
<widget spec_version="2.0">
  <info>
    <name>uitest</name>
    <version>0.1</version>
    <author>render</author>
    <clientversion>0.98</clientversion>
    <shortdescription>Example widget demonstrating use of Helium UI components</shortdescription>
    <longdescription>Example widget demonstrating use of Helium UI components</longdescription>
    <tags>test example helium script ui component view</tags>
  </info>
   
  <parameters>
    <parameter type="string" name="widgetname" description="Name of widget" editable="no">UI Test</parameter>
  </parameters>
  
  <resources>
    <img src="bkg.png"/>
    <img src="selector.png"/>
    
    <img src="bubble_genie.png"/>

    <img src="canvas_nuppi.png"/>
    
    <img src="form_choice_bg.png"/>
    <img src="form_choice_bg_selected.png"/>
    <img src="form_choice_arrow.png"/>
    <img src="menu2.png"/>

    <img src="picture_frame.png"/>
    <img src="picture_1.png"/>
    <img src="picture_2.png"/>
    <img src="picture_3.png"/>
    
    <img src="list_star.png"/>
    <img src="list_flight_of_fury.png" scale="true"/>
    <img src="list_attack_force.png" scale="true"/>
    <img src="list_shadow_man.png" scale="true"/>
    <img src="list_mercenary_for_justice.png" scale="true"/>
    <img src="list_black_dawn.png" scale="true"/>

    <img src="styles_bullet.png"/>
    <img src="styles_selector.png"/>
    <img src="styles_wood.png"/>
    
    <code src="uitest.he"/>
    
    <stylesheet>
      white {
        background: solid white;
      }
      
      minbg {
        background: grid9 "bkg.png" 6 6 6 6;
      }
            
      titleLabel {
        padding: 0 0 10 0;
        font-1: small bold;
        color-1: #000000;
        align: hcenter vcenter;
      }
      
      maxi {
        color-1: black;
        background: solid white;
        border: 1 1 1 1;
        border-type: rectangle black;
      }
      
      mainLabel {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: small;
        color-1: #000000;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
        }
      }
      
      header {
        background: vgradient #112f55 #30517a;
        font-1: small bold;
        align: hcenter vcenter;
        color-1: #ffffff;
        padding: 3sp 6sp 3sp 6sp;
      }
      
      <!-- Canvas example -->
      clock {
        background: solid white;
        color-1: black;
        image-1: "canvas_nuppi.png";
      }
      
      <!-- Form example -->
      form.base {
        margin: 0 10 5 10;
        background: solid #e3e3e3;
        border: 1 1 1 1;
        border-type: rectangle #a4a4a4;
        padding: 2 4 2 2;
        font: proportional small plain;
        color: #333333;

        focused {
          border-type: rectangle red;
        }
      }

      form.label : form.base {
        font: proportional medium plain;
        background: none;
        border-type: none;
      }
      
      form.input : form.base {
        font: proportional medium plain;
      }
      
      form.choice.display : form.base {
        label-icon-orientation: right;
        image: "form_choice_arrow.png";

        focused {
          border-type: rectangle red;
        }
      }
      
      form.choice.list {
        width: 100%;
        align: left bottom;
        background: solid #385179;
        border: 3 3 3 3;
        border-type: image "form_choice_bg.png";
        padding: 3 3 3 3;
      }

      form.choice.item {
        padding: 2 10 2 10;
        font: proportional medium bold;
        color: white;
        image: "menu2.png";
        label-icon-orientation: right;
      
        focused {
          background: grid9 "form_choice_bg_selected.png" 3 3 3 3;
        }
      }

      
      <!-- Input example -->
      input {
        border: 1 1 1 1;
        border-type: rectangle black;        
        margin: 2 2 2 2;
        padding: 2 2 2 2;
        color: black;
        font: small;
      }
      
      <!-- List example -->
      list.bg {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: small;
        color-1: #000000;
        /*vspacing: 5;
        hspacing: 5;*/
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
        }
      }
      
      list.img {
        padding: 3sp 6sp 3sp 0;
      }
      
      list.star {
        padding-top: 4sp;
        align: vcenter hcenter;
      }
      
      list.name {
        color: black;
        font: medium bold;
      }

      list.tag {
        color: black;
        font: small;
      }
      
      list.plot {
        color: black;
        font: small;
        padding: 6sp 6sp 6sp 6sp;
      }

      <!-- Picture example -->
      picture.bg {
        align: hcenter vcenter;
      }

      picture.frame {
        border: 20 21 21 21;
        border-type: image "picture_frame.png";
        align: hcenter vcenter;
        margin: 10 10 10 10;
      }
      
      <!-- Sliding example -->
      sliding.bg {
        border: 4 4 4 4;
        border-type: rectangle black;
      }
      
      sliding.text {
        color-1: black;
        font-1: large bold;
        align: hcenter vcenter;
      }
      
      <!-- Styles -->
      styles.base {
        margin: 3 3 3 3;
        padding: 2 5 2 5;
      }

      styles.container {
        border: 1 1 1 1;
        border-type: none;
        
        focused {
          border: 1 1 1 1;
          border-type: rectangle red;
        }
      }
      
      styles.1 : styles.base {
        background: vgradient white #cccccc;
        
        focused {
          background: vgradient #cccccc white;
        }
      }
      
      styles.2 : styles.base {
        border-type: rectangle red #cccccc blue brown;
        border: 4 4 4 4;

        focused {
          background: solid yellow;
        }
      }
      
      styles.3 : styles.base {
        background: grid9 "styles_selector.png" 2 2 2 2;

        focused {
          font: medium bold;
        }
      }

      styles.4 : styles.base {
        font: small underlined;
        align: vcenter right;

        focused {
          align: vcenter left;
        }
      }

      styles.5 : styles.base {
        align: vcenter hcenter;
        border-bottom: 10;
        padding-top: 10;
        border-type: rectangle black;

        focused {
          padding-top: 0;
          border: 10 10 10 10;
        }
      }

      styles.6 : styles.base {
        background: image "styles_wood.png" transparent top left repeat-x repeat-y;
        color: white;
        
        focused {
          color: red;
        }
      }

      styles.7 : styles.base {
        background: hgradient blue black;
        font: large bold;
        color: #cccccc;
        
        focused {
          background: hgradient black blue;
        }
      }

      styles.8 : styles.base {
        padding-left: 12;
        background: image "styles_bullet.png" transparent vcenter left;
        
        focused {
          padding-left: 0;
          padding-right: 12;
          align: vcenter right;
          background: image "styles_bullet.png" transparent vcenter right;
        }
      }

      
      
      <!-- Table example -->
      table.header {
        background: solid #D4D0C8;
        border: 0 1 1 0;
        border-type: rectangle #808080;
        padding: 2 2 2 2;
        font: small;
        color: black;
        align: vcenter hcenter;
      }
      
      table.cell {
        background: solid white;
        border: 0 1 1 0;
        border-type: rectangle #C0C0C0;
        padding: 2 2 2 2;
        font: small;
        color: black;
        align: left vcenter;
        
        focused {
          border-type: rectangle black;
          border: 2 2 2 2;
          padding: 0 0 0 0;
          cursor-color: white;
        }
      }
      
      <!-- Ticker example -->
      ticker.normal {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: small;
        color-1: #000000;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
        }
      }

      ticker.loop.blurred {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: small;
        color-1: #000000;
        ticker-speed: 200;
        ticker-mode: loop;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
        }
      }

      ticker.loop.focused {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: small;
        color-1: #000000;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
          ticker-speed: 200;
          ticker-mode: loop;
        }
      }

      ticker.bounce.blurred {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: large bold;
        color-1: #000000;
        ticker-speed: 100;
        ticker-mode: bounce;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
        }
      }

      ticker.bounce.focused {
        background: grid9 "selector.png" 5 5 8 5;
        padding: 1 5 1 5;
        border: 1 0 0 0;
        font-1: large bold;
        color-1: #000000;
      
        focused
        {
          padding: 1 4 1 4;
          border-type: rectangle #b54000;
          border: 1 0 0 0;
          background: vgradient #f3742e #f35600;
          color-1: #ffffff;
          ticker-speed: 100;
          ticker-mode: bounce;
        }
      }
    </stylesheet>
  </resources>
    
  <layout minimizedheight="65sp">
    <view id="viewMini" class="minbg">
      <label class="titleLabel" top="0%" right="100%-8px" bottom="100%" left="8px">${widgetname}</label>
    </view>
  
    <view id="viewMaxi" class="maxi">
      <script id="maxi" class="maxi"/>
    </view>
	  
  	<webview>
      <weblabel class="top:0px;left:10px;">${widgetname}</weblabel>
    </webview>
	</layout>
 
</widget>