videogames development

  • Home
  • Tag: videogames development

Unity3D Game Engine – GUI Text – New Line Break

Unity3D Game Engine – GUI Text – New Line Break

New Line Break inside Inspector

1. MAIN TOP MENU> GameObject> Create Other> GUI Text
2. Open Windows Note Pad> Type your text and indent it> select it and press CTRL+C (Copy)
3. Hierarchy> select GUI Text> Inspector> GUIText> Text slot, CTRL+V (Paste)

New Line Break via JS Script

1. MAIN TOP MENU> GameObject> Create Other> GUI Text
2. Hierarchy> select GUI Text> Inspector> ‘Add Component’> New Script> MyText.JS

#pragma strict

function Start () {

}

function Update () {
guiText.text = "This is a \n line break";
}

Other supported characters:

  \n	New line
  \t	Tab
  \v    Vertical Tab
  \b	Backspace
  \r	Carriage return
  \f	Formfeed
  \\	Backslash
  \'	Single quotation mark
  \"	Double quotation mark
  \d	Octal
  \xd	Hexadecimal
  \ud	Unicode character
By |Unity3D, Video Games Development|Commenti disabilitati su Unity3D Game Engine – GUI Text – New Line Break
Read More

Unity 3D Game Engine – Custom Bitmap Fonts

Unity 3D Game Engine – Custom Bitmap Fonts

Inside Unity3D When dealing with text in a project, there are 2 choices: GUIText and TextMeshes.

a. MAIN TOP MENU> GameObject> Create Other> GUIText is a HUD (head-up display) element drawn on top of everything else, it is a vector text.
It use only standard Fonts

b. MAIN TOP MENU> GameObject> Create Other> 3D Text is a real 3D Text with bitmaps mapped over some planes.
It can use custom bitmap fonts made with Photoshop

Create a Text Mesh and style it

1. MAIN TOP MENU> GameObject> Create Other> 3D Text
2. Inspector> Text Mesh> Text> use html tags, examples: 

This is <b>bold</b>
Nested <b>tags <i>are</i> aloowed</b> yeah!
We are <color=green>green</color> with envy
We are <size=50>largely</size> unaffected

Official docs at http://docs.unity3d.com/Manual/StyledText.html

Remove bad low res pixel effect

1. Creare Text Mesh with a large size: Score Text
2. Reduce it with Transform Tool

Import New Fonts

Unity 3D supports .ttf .dfont .otf files.

1. MAIN TOP MENU> Assets> Import New Asset…> YourTruetype.ttf, you will see the font into Project window
Unity 3D will create: – Font Name
– Font Material (color + texture)
– Font Texture (if you type a word, a bitmap texture of letters will be created here)

2. Hierarchy> select> your 3D Text> from Project DRAG AND DROP the font over Text Mesh> Font

Dynamic Fonts

1. Select the Font> Inspector> Character> Dynamic / Unicode / ASCII default set / ASCII lower case / ASCII upper case / Custom Set

When you set the Characters drop-down in the Import Settings to Dynamic, Unity will not pre-generate a texture with all font characters. Instead, it will use the FreeType font rendering engine to create the texture on the fly.

This has the advantage that it can save in download size and texture memory, especially when you are using a font which is commonly included in user systems, so you don’t have to include the font data, or when you need to support asian languages or large font sizes (which would make the font textures very large using normal font textures).

Convert Dynamic Fonts for iOS/Android

iOS/Android device does NOT support Dynamic font, which means you cannot adjust font’s size, style in TextMesh component or GUIText component.

1. MAIN TOP MENU> Assets> Import New Asset…> YourTruetype.ttf
Unity 3D will create: – Font Name
– Font Material (color + texture)
– Font Texture (if you type a word, a bitmap texture of letters will be created here)

2. Select Font Size: 32 -> maggiore è la dimensione del font, maggiore sarà la dimensione della texture finale del punto 3.
Font Name> Character> Unicode or ASCII

3. Select Font Texture> Unapplied Import Setting> ‘Apply’> it creates a texture 128x128px or over with ALL CHARACTERS, they are already packed.

4. Drag the font into TextMesh, 3D Text or GUIText component.
For TextMesh and 3D Text don’t forget to drag font material (you can find it when collapse font asset) into MeshRender.

5. In TextMesh, 3D Text or GUIText, set Font Size to 0, Font Style to Normal. The font size and style will be determined by the font asset.
Build to your device.

Official Docs at:

– http://docs.unity3d.com/Manual/class-Font.html

– http://wiki.etc.cmu.edu/unity3d/index.php/Unity_font_issue_on_iOS/Android

Create Custom TTF Fonts

You can create your own TTF Font using a software as ‘Font Forge’ at http://sourceforge.net/projects/fontforge/files/latest/download?source=files

Create an editable texture from Dynamic Fonts

1. MAIN TOP MENU> Assets> Import New Asset…> YourTruetype.ttf
Unity 3D will create: – Font Name
– Font Material (color + texture)
– Font Texture (if you type a word, a bitmap texture of letters will be created here)

2. Select Font Size: 32 -> maggiore è la dimensione del font, maggiore sarà la dimensione della texture finale del punto 3.
Font Name> Character> Unicode or ASCII

3. Select Font Name> Inspector> LMB over TOP RIGHT small gear icon> Create Editable Copy
It will create a bitmap font with:
– Font Name_copy -> con le coordinate di ritaglio delle singole lettere
– Font Material_copy -> il materiale
– Font Texture_copy -> png con la mappa alfa

4. Open your Project Folder/Assets/Texture_copy.png> open and edit it with Photoshop.
Now you can create Font_new_color.png, with color and alpha in the same file.
A working sample here:

Font_new_color.png

3D Text

5. MAIN TOP MENU> GameObject> Create Other> 3D Text

6. Hierarchy> 3D Text> Inspector
> Mesh Renderer> Materials> DRAG AND DROP Font Material_copy, è il materiale di mapping
> TextMesh> Font> DRAG AND DROP Font Name_copy, è la mappa di ritaglio in forma testuale per identificare le lettere

7. Project> Font Material_copy> Inspector> Shader: Unlit/Transparent -> Texture DRAG ANd DROP Font_new_color.png

8. :) DONE!!!!!!!!!!!!

GUI Text

5. MAIN TOP MENU> GameObject> Create Other> GUI Text

6. Hierarchy> GUI Text> Inspector
> Mesh Renderer> Font> DRAG AND DROP Font Name_copy

7. :) DONE!!!!!!!!!!!!

NOTICE that at the end YOU CAN NOT STYLE TEXT with:

This is <b>bold</b>
Nested <b>tags <i>are</i> aloowed</b> yeah!
We are <color=green>green</color> with envy
We are <size=50>largely</size> unaffected

Convert TTF Fonts to Bitmap Fonts

Bitmap fonts, which consist of a Texture atlas (atlante) containing all of the required letters from the font, and a text data file describing the location and size of each letter on that texture atlas.

Download the software ‘Hiero’ at https://code.google.com/p/libgdx/downloads/detail?name=hiero.jar

Open Hiero
1. Font> File> load your TTF
2. Rendering setup Page Width and Page Height
3. Padding
4. File> Export

The result will be 2 files:
1.myfont.fnt -> a text file with the atlas -> rename myfont.txt
2.myfont.png -> a bitmap image font -> edit with Photoshop if you want

Use Bitmap Fonts inside Unity 3D

1. MAIN TOP MENU> Assets> Import New Asset…> Import myfont.txt and myfont.png
2. Project Window> RMB> Create> Material, name it myfontBMP
3. Project Window> RMB> Create> Custom Font, name it myfontBMP
4. Select the Material> assign the texture myfont.png
5. Follow the instruction inside this tutorial: http://sysmagazine.com/posts/212587/

Creation of bitmap fonts in Unity is very uneasy :(
In my opinion there are a lot time-saving plugins inside the Asset Store to easily manage custom font…

Custom Fonts Plugins

Text Box
https://www.assetstore.unity3d.com/en/#!/content/2877

SpriteText / Custom Bitmap Fonts
https://www.assetstore.unity3d.com/en/#!/content/3095

Advance Text Animations Plugins

TextFX
It is a text animation plugin for the Unity 3D game engine.
It is really time saving, see in action at: http://www.codeimmunity.co.uk/TextFx/index.php

By |Unity3D, Video Games Development|Commenti disabilitati su Unity 3D Game Engine – Custom Bitmap Fonts
Read More

Unity 3D – On Click – Emit Particles

Unity 3D – On Click – Emit Particles

1. MAIN TOP MENU> GameObject> Create> Other> Cube

2. Hierarchy> select the Cube> Inspector> ‘Add Component’> Effects> Partycle System> UNCHECK ‘Play On Awake’

3. Hierarchy> select the Cube> Inspector> ‘Add Component’> New Script> OnClick.JS

OnClick.JS:


#pragma strict
 
function Start () {
 
}
 
function OnMouseDown ()
{
        // When you click over the object
        // the particle system will emit 5 particles
        particleSystem.Emit(5);
}
 
function Update () {
 
}

NOTICE: the components structure into Inspector will be:

– Cube
– Cube (Mesh Filter)
– Box Collider -> there is no ‘OnMouseDown’ effect without it!
– Mesh Renderer
– Particle System
– OnClick.JS -> it calls particleSystem as effect attached to the Object

By |Unity3D, Video Games Development|Commenti disabilitati su Unity 3D – On Click – Emit Particles
Read More

Unity 3D Game Engine – Particles follow Cursor Pointer

Unity 3D Game Engine – Particles follow Cursor Pointer

1. MAIN TOP MENU> Main Object> Create Other> Particle System

2. Inspector> Particle System> Add Component> New Script> FollowMouse.JS

3. FollowMouse.JS


#pragma strict
 
function Start () 
{ 
 Screen.showCursor = false; 
} 
 
// -------------------------------
// FOLLOW MOUSE POSITION START
// -------------------------------
public var depth = 10.0; 
 
function FollowMousePosition()
{ 
 var mousePos = Input.mousePosition; 
     var wantedPos = Camera.main.ScreenToWorldPoint (Vector3 (mousePos.x, mousePos.y, depth)); 
     transform.position = wantedPos; 
}
// -------------------------------
// FOLLOW MOUSE POSITION END
// -------------------------------
 
function Update () 
{ 
 FollowMousePosition();  
}

4. Inspector> Setup the Partycle System to create a fairy dust effect:

Particle System

– Start Size: 0.3
– Gravity Multiplier: 1
– Simulation Space: World -> really important!!!

Emission: check it

– Rate: 30

Shape: check it

– Shape: Sphere
– Radius 0.1

Limit Velocity over Lifetime: check it

– Speed: 3
– Dampen: 1

By |Unity3D, Video Games Development|Commenti disabilitati su Unity 3D Game Engine – Particles follow Cursor Pointer
Read More

Unity 3D Game Engine – Real Time In Game Clock

Unity 3D Game Engine – Real Time In Game Clock

1. Hiearchy> GUI Text, choose a font or download it from http://www.1001freefonts.com/3d-fonts.php

2. Hierarchy> Main Camera, attach ‘Clock.js’

Clock.js


#pragma strict

var ClockText  : GUIText;  // Hierarchy DRAG E DROP over var GUI Text in Inspector  
private var dt = Date();
 
 
function Update () {
 
var day = dt.Now.Day;
var month = dt.Now.Month;
var year = dt.Now.Year;
var hours = dt.Now.Hour;
var minutes = dt.Now.Minute;
var seconds = dt.Now.Second;
 
ClockText.text = day + " " + month + " " + year + " " + hours + " " + minutes + " " + seconds;
 
}

Hierarchy> Main Camera> Inspector> Clock.js, assign GUI Text

Today, the result is:

16 5 2014 10 40 32

By |Unity3D, Video Games Development|Commenti disabilitati su Unity 3D Game Engine – Real Time In Game Clock
Read More