[youtube:http://youtube.com/watch?v=eO9oseiCTdk]
Description from video:
A robotic fish developed by scientists from Essex University is put through its paces in a special tank at the London Aquarium. It works via sensors and has autonomous navigational control.
Should be hard creating robotics to work underwater…
A example of how flexible can be extending your own Custom Node. In this example I’m creating a comic ballon that can be simple created by:
Ballon {
text: "I can has fx?"
}
That can also be incremented to work like this:
[youtube:http://br.youtube.com/watch?v=LexJbO1-ti4]
Here a simpler implementation of a balloon, without the dragging behavior but that can be used for creating comics.
import javafx.scene.CustomNode;
import javafx.scene.Group;
import javafx.scene.geometry.Ellipse;
import javafx.scene.geometry.Polygon;
import javafx.scene.geometry.ShapeSubtract;
import javafx.scene.paint.Color;
import javafx.scene.Font;
import javafx.scene.text.Text;
import javafx.scene.FontStyle;
import java.lang.Math;
public class Balloon extends CustomNode {
/* (cx,cy) center of the balloon */
public attribute cx: Number = 100 on replace {
distance = Math.sqrt(toX * toX + toY * toY);
}
public attribute cy: Number = 100 on replace {
distance = Math.sqrt(toX * toX + toY * toY);
}
/* (toX, toY) point where balloon points at */
public attribute toX: Number = cx on replace {
distance = Math.sqrt(toX * toX + toY * toY);
}
public attribute toY: Number = cy on replace {
distance = Math.sqrt(toX * toX + toY * toY);
}
/* what is writted in the balloon */
public attribute text: String = "balloon";
/* font for the text */
public attribute font: Font = Font {
size: 24
style: FontStyle.PLAIN
}
/* Distance between (cx,cy) and (toX, toY) */
private attribute distance: Number;
/* Text inside the balloon */
private attribute label = Text {
font: bind font
content: bind text
}
/* place the label correctly based on text */
init {
label.x = -label .getWidth() / 2;
label.y = label.font.size / 2;
}
/* ballon body */
private attribute body = ShapeSubtract{
fill: Color.WHITE
stroke: Color.BLACK
blocksMouse: true
a: bind [
Ellipse {
radiusX: bind label.getWidth() / 2 + 20
radiusY: bind font.size * 2
},
Polygon {
points : [
10 * ( - toY / distance),
10 * (toX / distance),
10 * (toY / distance),
10 * ( - toX / distance),
toX,
toY
]
}
]
}
public function create(): Node {
return Group {
cursor: Cursor.HAND
content: [ body, label]
translateX: bind cx
translateY: bind cy
}
}
}
Teddy brincando (destruindo) um colar de luau.
Como já acontece tradicionalmente na Taça Pet, os dois piores times do curso de Computação UFC se enfrentam em uma partida memorável. Esse ano nosso time, Eu Podia tá Matando, perdeu primeiro de 2 a 0 para o Nerdproud e depois perdeu de 7 a 0 para o SECO. Pelo menos esse ano eu fiz um gol.
Na nossa avaliação foi um resultado muito bom esse ano. Não tivemos nenhuma baixa e ninguém foi teve que ir pro hospital. Além disso tivemos a maior platéia de todos os tempos, deviam haver umas 50 pessoas assistindo o jogo. Definitivamente um espetáculo.
Só faltou mesmo para sermos os campeões:
Tirando isso, estamos muito bem.
Até ano que vêm tem mais.
An simple color picker that can be also used as a gadget.
import javafx.ui.*;
import javafx.ui.canvas.*;
var colors = [red:Color, orange:Color, yellow:Color, green:Color,
cyan:Color,blue:Color, magenta:Color, gray:Color];
var chosenColor: Paint;
chosenColor = black:Color;
var x = 120;
var y = 70;
Canvas{
content: Group{
transform: bind translate(x,y)
content: [Star{
points: sizeof colors
rin: 30
rout: 50
fill: bind chosenColor
onMouseDragged: operation(e) {
x += e.localDragTranslation.x;
y += e.localDragTranslation.y;
}
},
foreach (i in [1..sizeof colors]) Circle {
var: self
transform: [rotate(i*360/sizeof colors,0,0), translate(50,0)]
radius: 10
fill: colors[i%sizeof colors]
onMouseClicked: operation (e){
chosenColor = self.fill;
}
}]
}
}
Two simple JavaFX code handling onMouseDragged event.
import javafx.ui.*;
import javafx.ui.canvas.*;
Canvas {
content: Circle {
var x = 50
var y = 50
transform: bind translate(x, y)
radius: 30
fill: red
onMouseDragged: operation(e) {
x += e.localDragTranslation.x;
y += e.localDragTranslation.y;
}
}
}
import javafx.ui.*;
import javafx.ui.canvas.*;
Canvas {
content: Circle {
var x = 50
var y = 50
var radius = 30
transform: bind translate(x, y)
radius: bind radius
fill: red
onMouseDragged: operation(e) {
if (e.button == 1){
x += e.localDragTranslation.x;
y += e.localDragTranslation.y;
}
if (e.button == 3) {
radius += e.localDragTranslation.x;
}
}
}
}
import javafx.ui.*;
import javafx.ui.canvas.*;
Canvas {
content: [
Rect {x: 50, y: 50, width: 50, height: 50, fill: orange },
Circle {
var x = 50
var y = 50
var radius = 30
var color = red:Color
transform: bind translate(x, y)
radius: bind radius
fill: bind color
onMouseDragged: operation(e) {
if (e.button == 1){
x += e.localDragTranslation.x;
y += e.localDragTranslation.y;
}
if (e.button == 3) {
radius += e.localDragTranslation.x;
}
}
onMousePressed: operation(e){
color = Color {blue: 0.0, green: 0.0, red: 1.0, opacity: 0.5};
}
onMouseReleased: operation(e){
color = red:Color;
}
}]
}
You can test this examples with thhe JavaFX Pad or using Netbeans with the JavaFX Plugin.
Lembra daquele nosso gato em Java FX? Agora ele move os olhos com cliques em botões.
Código fonte:
import javafx.ui.canvas.*;
import javafx.ui.*;
class Cat extends CompositeNode{
attribute look: Number; // -1.0 to 1.0
operation lookLeft();
operation lookCenter();
operation lookRight();
}
attribute Cat.look = 0; // 0 = middle
operation Cat.lookLeft(){
look = [look, look - 0.1 .. -1.0] dur 1000;
}
operation Cat.lookCenter(){
var step = if look < 0 then 0.1 else -0.1;
look = [look, look+step .. 0.0] dur 1000;
}
operation Cat.lookRight(){
look = [look, look + 0.1 .. 1.0] dur 1000;
}
function Cat.composeNode(){
var head = Ellipse {cx:100, cy:100, radiusX:100, radiusY:50, fill:black };
var rightEar = Arc {x:100, y:10, height:150, width:100,
startAngle:-20, length:90, closure:PIE, fill:black};
var leftEar = Arc {x:000, y:10, height:150, width:100,
startAngle:110, length:90, closure:PIE, fill:black};
var leftEye = Ellipse { cx:60, cy:100, radiusX:30, radiusY:15, fill:white};
var rightEye = Ellipse { cx:140, cy:100, radiusX:30, radiusY:15, fill:white};
var nose = Arc { x:85, y:110, height:20, width:30,
startAngle:45, length:90, closure:PIE, fill:white};
var rightIris = Ellipse { cx: bind 140+look*20, cy:100,
radiusX:5, radiusY:15, fill:black};
var leftIris = Ellipse { cx: bind 60+look*20, cy:100,
radiusX:5, radiusY:15, fill:black};
return Group{content: [head, rightEar, leftEar, leftEye,
leftIris, rightEye, rightIris, nose]};
}
var myCat = Cat{};
var myCatControl = View {
transform: [translate(0, 150)]
content: GroupPanel {
cursor: DEFAULT
var row = Row {alignment: BASELINE}
var column1 = Column { }
var column2 = Column { }
var column3 = Column { }
var column4 = Column { }
var column5 = Column { }
rows: [row]
columns: [column1, column2, column3, column4]
content:
[SimpleLabel {
row: row
column: column1
text: "Look:"
},
Button {
row: row
column: column2
mnemonic: L
text: "Left"
action: operation() {
myCat.lookLeft();
}
},
Button {
row: row
column: column3
mnemonic: C
text: "Center"
action: operation() {
myCat.lookCenter();
}
},
Button {
row: row
column: column4
mnemonic: R
text: "Right"
action: operation() {
myCat.lookRight();
}
}]
}
};
Canvas {
content: [myCatControl, myCat]
}
Downloads:
Continuando minhas aventuras no mundo dos screencast eu preparei mais um mostrando algumas das novidades no editor de código-fonte do Netbeans 6.0.
Esse screencast cobre o que eu consegui mostrar no café com tapioca de dezembro e eu ainda quero fazer outros mostrando o Matisse (editor gráfico do NB) e o Collaboration (pluggin multiusuário).
Makingoff: Eu usei o Istambul, uma ferramenta para captura de screencasts no Linux. Infelizmente eu ainda não estou conseguindo gravar áudio com ele. Depois eu converti de ogg pra flv com o memcoder e usei o Flash Media Player para criar a página que toca o vÃdeo.