<?xml version='1.0' encoding='utf-8'?>
<xmlgui>
	<skin>
		<guistyle id='default' default='label'></guistyle>
		<guistyle id="screen">
			normal-background: url(screen_frame.png);
			border: 135;
		</guistyle>
		<guistyle id="hangingsignbutton">
			border: 0;
			margin: 0;
			padding: 0 0 0 34;
			fixed-width: 269;
			fixed-height: 206;
			normal: url(welcome_sign.png) white;
			hover: url(welcome_sign.png) yellow;
			active: url(welcome_sign.png) green;
			alignment: LowerCenter;			
		</guistyle>
		<guistyle id="settings">
			normal-background: url(gui_screen_big.png);			
		</guistyle>
		<guistyle id="slider" default="horizontalslider">
			normal-background: url(slider_track.png);
			border: 25 25 10 10;
			padding: 25 25 0 0;
			margin: 0;
			overflow: 0;
			fixed-height: 27;
		</guistyle>
		<guistyle id="sliderthumb" default="horizontalsliderthumb">
			normal-background: url(slider_thumb.png);
			hover-background: url(slider_thumb.png);
			active-background: url(slider_thumb.png);
			focused-background: url(slider_thumb.png);
			fixed-width: 26;
			fixed-height: 27;
		</guistyle>
		<guistyle id="checkbox" default="label">
			normal-background: url(checkbox.png);
			onnormal-background: url(checkbox_checked.png);
			fixed-width: 29;
			fixed-height: 32;
		</guistyle>
		<guistyle id="button" default="button">
			normal-background: url(button_normal.png);
			hover-background: url(button_hover.png);
			active-background: url(button_active.png);
			focused-background: url(button_focused.png);
			border: 20 20 7 7;
			padding: 0;
			margin: 0;
			fixed-width: 146;
			fixed-height: 44;
		</guistyle>
		<guistyle id="framed" default="box">
			normal-background: url(list_frame.png);
			border: 15;
			padding: 15;
		</guistyle>
		<guistyle id="storyarea" default="box">
			normal-background: url(chapter_screen_frame.png);
			border: 40;
			padding: 40;
		</guistyle>
		<guistyle id="story">
			font: Boisterb;
			font-size: 34;
			alignment: MiddleCenter;
		</guistyle>
		<guistyle id="menu" default="box">
			normal-background: url(gui_screen_small.png);
			border: 0;
			padding: 30 30 50 90;
		</guistyle>
		<guistyle id="title" default="label">
			font: Boisterb;
			font-size: 20;
		</guistyle>
	</skin>
	<gui>
		<area id="screen" guistyle="screen" style="width: 100%; height: 100%">
			<area id="hangingsign" guistyle="hangingsign" scrollin="top 0.5" scrollout="top 0.5" style="display: false; width: 269px; height: 206px; align: right; top: -60px; valign: top; right: 100px;">
				<button guistyle='hangingsignbutton' onclick="Showcase">XmlGui Showcase&#10;GUI Art by ZdenekSasek.com</button>
			</area>
			
			<area id="menu" guistyle="menu" fadein="0.5" fadeout="0.5" style="display: false; align: center; valign: middle; width: 413px; height: 312px;">
				<area id="menutitle" style="align: center; valign: top; width: 400px; height: 50px; top: 12px;">
					<horizontal><space/>
						<label guistyle="title">Main menu</label>
					<space/></horizontal>
				</area>
				
				<vertical>
					<space/>
					<horizontal>
						<space/>
						<button onclick="ShowStory">Start</button>
						<space/>
					</horizontal>
					<horizontal>
						<space/>
						<button onclick="ShowSettings">Settings</button>
						<space/>
					</horizontal>
					<space/>
				</vertical>
			</area>
			
			<area id="storyarea" onclick="NextStorySlide" guistyle="storyarea" scrollin="right 0.5" scrollout="left 0.5" style="display: false; align: center; valign: middle; width: 50%; height: 50%">
				<vertical>
					<space/>
					<label id="story0" guistyle="story">In the beginning there was OnGUI...&#10;&#10;..but with lots and lots of programming, nobody really liked it.</label>
					<label id="story1" guistyle="story" style="display: false">Then there was XmlGui!&#10;&#10;Spend time on fancy features, not standard GUI controls!</label>
					<label id="story2" guistyle="story" style="display: false">Yay!</label>
					<space/>
					<horizontal>
						<space/>
						<label>click for more</label>
						<space/>
					</horizontal>
				</vertical>
			</area>
			
			<area id="settings" guistyle="settings" fadein="0.4" fadeout="0.35" style="display: false; align: center; valign: middle; width: 413px; height: 461px;">
				<area id="title" style="align: center; valign: top; width: 400px; height: 50px; top: 12px;">
					<horizontal><space/>
						<label guistyle="title">Settings</label>
					<space/></horizontal>
				</area>
				
				<area style="align: center; valign: top; width: 340px; height: 315px; top: 55px;">
					<vertical>
						<horizontal>
							<label>Slider</label>
							<slider guistyle="slider" thumbstyle="sliderthumb" position="0.35"/>
						</horizontal>
						
						<horizontal>
							<label>Checkbox</label>
							<space/>
							<togglebutton tooltip="click to check" guistyle="checkbox"/>
						</horizontal>
						
						<horizontal>
							<label>Toggles</label>
							<space/>
							<togglebutton togglegroup='togglegroup' ontoggle='toggled' checked='true' guistyle="checkbox"/>
							<space>5</space>
							<togglebutton togglegroup='togglegroup' ontoggle='toggled' guistyle="checkbox"/>
							<space>5</space>
							<togglebutton togglegroup='togglegroup' ontoggle='toggled' guistyle="checkbox"/>
							<space>5</space>
							<togglebutton togglegroup='togglegroup' ontoggle='toggled' guistyle="checkbox"/>
							<space>5</space>
							<togglebutton togglegroup='togglegroup' ontoggle='toggled' guistyle="checkbox"/>						
						</horizontal>
						
						<label>Framed content</label>						
						<vertical guistyle="framed" scroll="true">
							<label>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </label>						
							<horizontal>
								<label>Buttons</label>
								<space/>
								<vertical>
									<button onclick="ShowStory">Show Story</button>
									<button onclick="CloseSettings">Close Settings</button>
								</vertical>
							</horizontal>
						</vertical>

					</vertical>
				</area>				
			</area>
		</area>
	</gui>
</xmlgui>

using UnityEngine;
using System.Collections;

public class XmlGuiZdenekSasek : MonoBehaviour {
	
	private XmlGui p_gui;
	private XmlGui gui
	{
		get {
			if(p_gui == null) p_gui = GetComponent();
			return p_gui;
		}
	}
	
	#region STORY SLIDES
	void NextStorySlide()
	{
		StartCoroutine(CoNextStorySlide());	
	}
	
	private bool coNextStoryBusy = false;
	IEnumerator CoNextStorySlide()
	{
		if(coNextStoryBusy) yield break;
		coNextStoryBusy = true;
		
		XmlGuiObject story = gui.getElementById("storyarea");
		
		if(story != null)
		{
			story.Hide();
			yield return new WaitForSeconds(0.5f);
			
			XmlGuiObject s0 = story.getElementById("story0");
			XmlGuiObject s1 = story.getElementById("story1");
			XmlGuiObject s2 = story.getElementById("story2");
			
			bool d0 = s0.xmlStyle.display;
			bool d1 = s1.xmlStyle.display;
			bool d2 = s2.xmlStyle.display;
			
			s1.xmlStyle.display = d0;
			s2.xmlStyle.display = d1;
			s0.xmlStyle.display = d2;
			
			if(!d2)
				story.Show();
			else
				ShowMainMenu();
		}
		
		coNextStoryBusy = false;
	}
	#endregion

	#region BUTTONS AND CLICKS
	void ShowStory()
	{
		HideMainMenu();
		XmlGuiObject settings = gui.getElementById("settings");
		settings.Hide();
		
		XmlGuiObject story = gui.getElementById("storyarea");
		story.Show();
	}
	
	void ShowSettings()
	{
		HideMainMenu();
		XmlGuiObject settings = gui.getElementById("settings");
		settings.Show();		
	}
	
	void CloseSettings()
	{
		ShowMainMenu();
		XmlGuiObject settings = gui.getElementById("settings");
		settings.Hide();
	}
	
	void HideMainMenu()
	{
		XmlGuiObject menu = gui.getElementById("menu");
		menu.Hide();
	}
	
	void ShowMainMenu()
	{
		XmlGuiObject menu = gui.getElementById("menu");
		menu.Show();
	}
	
	void Showcase()
	{
		Application.OpenURL("http://www.zdeneksasek.com");
	}
	#endregion
	
	#region WORLD ANIMATION
	public Animation worldAnimation;
	public WrapMode worldAnimationWrapMode;
	
	void Start()
	{
		if(worldAnimation != null)
			worldAnimation.wrapMode = worldAnimationWrapMode;
	}
	#endregion
}