JavaFx实现-渐变效果之一

自从JavaOne大会推出JavaFX后，我一直比较关注这个项目，它是一种利用Java的脚本技术，功能上近似于Flash。 它的优势在于，Flash虽有很好的功能和普及度，但它永远不能交付Java类库的大部分功能，而 JavaFX可以。因为也给了JavaFX一个“可能性”上的生存空间。



但是由于JavaFX推出的太晚，兼之文档较少，很多人还是对其望而止步，干等下去也不是办法。所以我最近空闲时会写一些JavaFX的小例子以作练习之用。

import  javafx.ui. * ;
import  javafx.ui.canvas. * ;
// 圆点渐变过滤器
class  CircleTransition  extends  CompositeNode  ... {
  //设定参数项 变量名：类型
    attribute r: Number;
    attribute d: Number;
    attribute w: Number;
    attribute h: Number;
    attribute xp: Number;
    attribute img: Image;
}
// 为参数赋值
attribute CircleTransition.r   =   - 45 ;
attribute CircleTransition.d   =   16 ;
attribute CircleTransition.w   =   320 ;
attribute CircleTransition.h   =   240 ;
attribute CircleTransition.xp  =   - w;
// 注入过滤器参数
function CircleTransition.composeNode()  =  Group  ... {
  content:[Clip ...{
  //注入shape
    shape: Rect ...{ x:0, y:0, width:w, height:h },
    //设定偏移
    transform: translate(10, 40),
    //注入Group
    content: Group ...{
    //加载ImageView用以显示图像
      content: [ImageView ...{
        transform: translate(-60, -30),
        image: this.img,
        //分段绘制图像
      }, Subtract ...{
        shape1: Rect ...{ x:0, y:0, width:w*4, height:h*4 },
        fill:orange,
        //bind
        transform: bind [rotate(r, 0, h), translate(-w+xp, 0)],
        shape2: Union ...{
          content: [foreach (j in [0..w/d], i in [0..h/d*2]) Circle ...{
            radius: j,
            cx: w-j*d,
            cy: i*d,
          }, Rect ...{
            x:-w, y:0, width:w+w/2, height:h*2,
          }]
        }
      }],
    }
  }, View ...{
    content: GroupPanel ...{
     var row = Row ...{alignment: BASELINE}
     var column1 = Column ...{}
     var column2 = Column ...{}
     //鼠标设为默认
      cursor: DEFAULT
      rows: [row]
      columns: [column1, column2]
      content: [SimpleLabel ...{
        row: row
        column: column1
        text: "操作:"
      }, Button ...{
        row: row
        column: column2
        opaque: false
        mnemonic: T
        text: "变更图像"
        action: operation() ...{
            xp = [0,d..w*2] dur 2000;
        }
      }]
    }
  }
]} ;
Frame  ... {
  title  : "JavaFX - 图像渐变效果1"
  width  : 350
  height : 350
  content: Canvas ...{ content: CircleTransition...{img: ...{ url: "image.jpg" }} }
  centerOnScreen: true
  visible: true
} ;

 


效果图：


第一次写代码的感觉就是效率太慢……

由解释到执行的效率比Swing还不能令人忍受（当然，有代码优化的余地，但还是太慢）

且抛去效率问题不提，桌面JavaFX现在还有一个比较关键的问题，那就是如何部署。对于从前没有安装过JRE的用户来说，JRE体积太大，而且现在从浏览器上进行按需安装（如使用Java Start Web等）的用户体验也不是特别好。

目前Sun的官方解决思路是为JRE引入一种新型的部署模型，初次下载时体积非常小，只有在需要时才下载其他的JRE组件。但是具体的效果如何，我们还需拭目以待。

PS:如果Windows能普及jre该有多好啊……