F3

ห่างเหินจาก Swing มานาน
เลยพึ่งได้ยินข่าว F3
F3 ย่อจาก "Form Follows Function".
เป็น project ของ Chris Oliver
โดยเขา design declarative script language
สำหรับการสร้าง gui ขึ้นมา
จุดเด่นของมันก็คือ มัน support ทั้ง Swing และ Java2D

ลองดูตัวอย่าง ที่ผม copy มาจาก tutorial ของเขา

Frame {
    title: "Hello World F3"
    width: 200
    content: Label {
        text: "Hello World"
    }
    visible: true
}

จะเห็นว่า ภาษามีลักษณะคล้ายๆ javascript

ที่นี้ลองแบบมี model + binding ด้วย

class HelloWorldModel {
    attribute saying: String;
}

var model = HelloWorldModel {
    saying: "Hello World"
};

var win = Frame {
    title: "Hello World F3"
    width: 200
    content: Label {
        text: bind model.saying
    }
    visible: true
};

ลองดูลูกผสมระหว่าง 2D กับ Swing

Canvas {
    content: Group {
        transform: []
        content:
        [Rect {
            x: 20
            y: 20
            height: 80
            width: 300
            arcHeight: 20
            arcWidth: 20
            fill: cyan
            stroke: purple
            strokeWidth: 2
        },
        Ellipse {
            cx: 150
            cy: 80
            radiusX: 100
            radiusY: 50
            fill: orange
            stroke: blue
            strokeWidth: 2
        },
        View {
            transform: translate(150, 70)
            content: Button {
               cursor: DEFAULT
               text: "Click Me!"
            }
        },
        Polygon {
             points: [5, 5, 25, 5, 15, 25]
             fill: gray
             stroke: black
             strokeWidth: 3
        },
        View {
            transform: translate(100, 40)
            content: TextField {
                columns: 15
                value: "This is a text field"
            }
        }]
    }
}

ที่น่าสนใจก็คือ มันเป็น graphic ที่สามารถ transform ได้ด้วย
ทำให้เราทำ swing เอียงๆ แบบนี้ แล้วยังสามารถป้อนข้อมูลได้ด้วย