3
0
mirror of https://github.com/britzl/monarch.git synced 2025-09-27 18:12:22 +02:00

Improved examples. Added transitions

This commit is contained in:
Björn Ritzl
2017-09-04 21:26:06 +02:00
parent 1e4b7ea60f
commit a68fac766f
14 changed files with 416 additions and 90 deletions

View File

@@ -9,6 +9,60 @@ background_color {
z: 0.0
w: 0.0
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "root"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 320.0
@@ -48,6 +102,7 @@ nodes {
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {

View File

@@ -1,7 +1,14 @@
local monarch = require "monarch.monarch"
local transitions = require "monarch.transitions.gui"
function init(self)
msg.post(".", "acquire_input_focus")
self.transition = transitions.create(gui.get_node("root"))
.show_in(transitions.slide_in_right, gui.EASING_OUTQUAD, 0.6, 0)
.show_out(transitions.slide_out_left, gui.EASING_INQUAD, 0.6, 0)
.back_in(transitions.slide_in_left, gui.EASING_OUTQUAD, 0.6, 0)
.back_out(transitions.slide_out_right, gui.EASING_INQUAD, 0.6, 0)
end
function on_input(self, action_id, action)
@@ -12,7 +19,6 @@ function on_input(self, action_id, action)
end
end
function on_reload(self)
-- Add input-handling code here
-- Remove this function if not needed
function on_message(self, message_id, message, sender)
self.transition.handle(message_id, message, sender)
end

View File

@@ -21,6 +21,26 @@ embedded_instances {
" value: \"menu\"\n"
" type: PROPERTY_TYPE_HASH\n"
" }\n"
" properties {\n"
" id: \"transition_show_in\"\n"
" value: \"menu:/go#menu\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_show_out\"\n"
" value: \"menu:/go#menu\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_in\"\n"
" value: \"menu:/go#menu\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_out\"\n"
" value: \"menu:/go#menu\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
"}\n"
"embedded_components {\n"
" id: \"collectionproxy\"\n"
@@ -207,6 +227,26 @@ embedded_instances {
" value: \"game\"\n"
" type: PROPERTY_TYPE_HASH\n"
" }\n"
" properties {\n"
" id: \"transition_show_in\"\n"
" value: \"game:/go#game\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_show_out\"\n"
" value: \"game:/go#game\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_in\"\n"
" value: \"game:/go#game\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_out\"\n"
" value: \"game:/go#game\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
"}\n"
"embedded_components {\n"
" id: \"collectionproxy\"\n"
@@ -270,6 +310,26 @@ embedded_instances {
" value: \"true\"\n"
" type: PROPERTY_TYPE_BOOLEAN\n"
" }\n"
" properties {\n"
" id: \"transition_show_in\"\n"
" value: \"popup:/go#popup\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_show_out\"\n"
" value: \"popup:/go#popup\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_in\"\n"
" value: \"popup:/go#popup\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
" properties {\n"
" id: \"transition_back_out\"\n"
" value: \"popup:/go#popup\"\n"
" type: PROPERTY_TYPE_URL\n"
" }\n"
"}\n"
"embedded_components {\n"
" id: \"collectionproxy\"\n"

View File

@@ -2,4 +2,5 @@ local monarch = require "monarch.monarch"
function init(self)
monarch.show(hash("menu"))
msg.post("@render:/", "clear_color", { color = vmath.vector4(0.4, 0.6, 0.8,1.0) })
end

View File

@@ -9,6 +9,60 @@ background_color {
z: 0.0
w: 0.0
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "root"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 320.0
@@ -48,6 +102,7 @@ nodes {
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {

View File

@@ -1,19 +1,24 @@
local monarch = require "monarch.monarch"
local transitions = require "monarch.transitions.gui"
function init(self)
msg.post(".", "acquire_input_focus")
self.transition = transitions.create(gui.get_node("root"))
.show_in(transitions.slide_in_right, gui.EASING_OUTQUAD, 0.6, 0)
.show_out(transitions.slide_out_left, gui.EASING_INQUAD, 0.6, 0)
.back_in(transitions.slide_in_left, gui.EASING_OUTQUAD, 0.6, 0)
.back_out(transitions.slide_out_right, gui.EASING_INQUAD, 0.6, 0)
end
function on_input(self, action_id, action)
if action_id == hash("touch") and action.released then
if gui.pick_node(gui.get_node("startgame_button"), action.x, action.y) then
print("BUTTON***************************************")
monarch.show(hash("popup"))
end
end
end
function on_reload(self)
-- Add input-handling code here
-- Remove this function if not needed
function on_message(self, message_id, message, sender)
self.transition.handle(message_id, message, sender)
end

View File

@@ -1,10 +1,17 @@
local monarch = require "monarch.monarch"
local transitions = require "monarch.transitions.gui"
function init(self)
msg.post(".", "acquire_input_focus")
self.ok = gui.get_node("ok_button")
self.cancel = gui.get_node("cancel_button")
gui.set_render_order(16)
self.transition = transitions.create(gui.get_node("root"))
.show_in(transitions.slide_in_top, gui.EASING_OUTQUAD, 0.6, 0)
.show_out(transitions.slide_out_top, gui.EASING_INQUAD, 0.6, 0)
.back_in(transitions.slide_in_top, gui.EASING_OUTQUAD, 0.6, 0)
.back_out(transitions.slide_out_top, gui.EASING_INQUAD, 0.6, 0)
end
function on_input(self, action_id, action)
@@ -18,3 +25,7 @@ function on_input(self, action_id, action)
end
end
end
function on_message(self, message_id, message, sender)
self.transition.handle(message_id, message, sender)
end

View File

@@ -9,6 +9,60 @@ background_color {
z: 0.0
w: 0.0
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "root"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 320.0
@@ -48,6 +102,7 @@ nodes {
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {
@@ -165,6 +220,7 @@ nodes {
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "root"
layer: ""
inherit_alpha: true
slice9 {

View File

@@ -1,13 +1,16 @@
local monarch = require "monarch.monarch"
local transitions = require "monarch.transitions.gui"
function init(self)
msg.post(".", "acquire_input_focus")
self.play = gui.get_node("play_button")
self.back = gui.get_node("back_button")
self.play_position = gui.get_position(self.play)
self.back_position = gui.get_position(self.back)
gui.set_position(self.back, self.back_position + vmath.vector3(0, 1000, 0))
gui.set_position(self.play, self.play_position + vmath.vector3(0, 1000, 0))
self.transition = transitions.create(gui.get_node("root"))
.show_in(transitions.slide_in_right, gui.EASING_OUTQUAD, 0.6, 0)
.show_out(transitions.slide_out_left, gui.EASING_INQUAD, 0.6, 0)
.back_in(transitions.slide_in_left, gui.EASING_OUTQUAD, 0.6, 0)
.back_out(transitions.slide_out_right, gui.EASING_INQUAD, 0.6, 0)
end
function on_input(self, action_id, action)
@@ -23,15 +26,5 @@ function on_input(self, action_id, action)
end
function on_message(self, message_id, message, sender)
if message_id == hash("transition_show_in") or message_id == hash("transition_back_in") then
gui.animate(self.play, gui.PROP_POSITION, self.play_position, go.EASING_INQUAD, 0.6, 0, function()
msg.post(sender, "transition_done")
end)
gui.animate(self.back, gui.PROP_POSITION, self.back_position, go.EASING_INQUAD, 0.6)
elseif message_id == hash("transition_show_out") or message_id == hash("transition_back_out") then
gui.animate(self.play, gui.PROP_POSITION, self.play_position + vmath.vector3(0, 1000, 0), go.EASING_INQUAD, 0.6, 0, function()
msg.post(sender, "transition_done")
end)
gui.animate(self.back, gui.PROP_POSITION, self.back_position + vmath.vector3(0, 1000, 0), go.EASING_INQUAD, 0.6)
end
self.transition.handle(message_id, message, sender)
end