Major Softwares

  INDEX PAGE

  1. 簡介
  2. Java, Android和LibGDX好書推介
  3. Java, Android和LibGDX要學的知識
  4. 用Windows寫Java程式
  5. 用Eclipse寫Java程式
  6. 用Eclipse寫Android程式
  7. 用Eclipse寫LibGDX程式
  8. Standard Java Naming Conventions
  9. System.out.println()的用法和意思
  10. Where is main() method in Android?

LibGDX - Splash & Menu Screen

  1. LibGDX: World, Texture, Background, Camera, Viewport, Screen & OpenGL
  2. LibGDX: Texture, TextureRegion, SpriteBatch & Sprite
  3. UML(Unified Modeling Language): Class Diagram
  4. Type Casting, Upcasting & Downcasting
  5. @Override的用法和意思
  6. LibGDX: Scene2d & Graphical User Interface(GUI)
  7. LibGDX: Splash Screen
  8. LibGDX: Texture Packer
  9. LibGDX: BitmapFonts, JSON & Skin
  10. Android: R.java File
  11. Android: onClick事件的5種實現方式
  12. LibGDX: Game Menu Screen
  13. LibGDX: Advanced Game Menu Screen (using Abstract Screen)
  14. LibGDX: Disposable Interface
  15. Java & LibGDX: super keyword
  16. LibGDX: Advanced Game Menu Screen (using AssetManager)
  17. Java: Array, Arrays, List, ArrayList & LibGDX: Array
  18. LibGDX: File I/O (Preferences)
  19. LibGDX: Game Level Selection Screen
  20. LibGDX: Advanced Game Level Selection Screen (using AssetManager)

LibGDX - Tiled 2D Platform Game

  1. LibGDX: Lifecylce (Render() Method)
  2. LibGDX: Delta Time
  3. LibGDX: Animation & Spritesheet
  4. LibGDX: Keyboard, Mouse & Touch Screen Control
  5. Input Control (Polling VS Event Driven Input)
  6. LibGDX: Tiled (Background and Foreground)
  7. LibGDX: Jumping Action
  8. LibGDX: Tiled (Collision Detection)
  9. LibGDX: Tiled (Bullet Class)
  10. LibGDX: Audio (Sound & Music)
  11. LibGDX: Tiled (Scrollable Background with Camera & HUD)
  12. LibGDX: WorldController & WorldRenderer Class

LibGDX/Java - Card Game No.1 - Blackjack

  1. LibGDX: Install & Setup Android Studio IDE
  2. LibGDX: Use Android Studio to Run Java Hello World
  3. LibGDX: Use Android Studio to Run LibGDX Hello World
  4. Adobe Illustrator: Basic Components Part 1
  5. Adobe Illustrator: Basic Components Part 2
  6. Adobe Illustrator: BlackJack Table & Cards
  7. LibGDX: Blackjack Animation
  8. LibGDX: Interpolation
  9. Java: toString() Method
  10. Java: Blackjack Shuffle Methods
  11. LibGDX: Blackjack Shuffle Method
  12. Java: Blackjack Card Game

LibGDX - Others

  1. Making and Displaying App Icon
  2. LibGDX: Displaying Traditional and Simplified Chinese Characters
  3. LibGDX: Handling Different Screen Resolutions

Unity Game Engine & C#

  1. Visual Studio: C# Hello World
  2. Unity: C# Hello World
  3. Unity: Handling Different Screen Resolutions
  4. Unity: Life Cycle
  5. Unity: StartCoroutine, StopCoroutine, IEnumerator & Yield
  6. Unity: Splash Screen
  7. Unity: Fonts, Traditional and Simplified Chinese Characters
  8. Unity: GameObject, Class Object, new & Instantiate
  9. Unity: Start Screen with Glowing Animated Button
  10. Unity: C# Get & Set Modifier
  11. Unity: Delegates & Events
  12. Unity: File I/O, Read & Write Text File & PlayerPrefs
  13. Unity: Game Level Selection Screen
  14. Unity: Game Menu Screen & ScreenManager
  15. Unity: Encrypt and Decrypt Text File
  16. Unity: Options Menu Screen
  17. Unity: Convert Numbers Image to Custom Font

Unity - Card Game No.1 - Blackjack

  1. Unity: Blackjack Card Game - Part 1 (Full Game)
  2. Unity: Blackjack Card Game - Part 2
  3. Unity: Blackjack Card Game - Part 3
  4. Unity: Blackjack Card Game - Part 4
  5. Unity: Blackjack Card Game - Part 5
  6. Unity: Blackjack Card Game - Part 6
  7. Unity: Blackjack Card Game - Part 7

以下是預告-Coming soon!


Secret Weapon No.1

  1. Unity: Card Game No.2

Advanced Programming

  1. Unity: GPS Programming
  2. Unity: User Login System
  3. Unity: Augmented Reality (AR)

Secret Weapon No.2

  1. Unity: GPS & AR Application

第17節 - LibGDX: Splash Screen

這一節我會介紹如何製作LibGDX遊戲的開埸畫面(Splash Screen)。

第13節 - UML(Unified Modeling Language): Class Diagram介紹過開埸畫面的類別圖(Class Diagram),如下圖:

Splash Screen過開埸畫面
  1. Game是abstract Class,ApplicationListener是interface,所以它們的關係是Realization。

  2. MyDemo13是Class,Game是abstract Class,所以它們的關係是Generalization。

  3. MyDemo13是Class,SplashScreen是Class(傳入MyDemo13內用),所以它們的關係是Association。

  4. SplashScreen是Class,MenuScreen是Class(傳入SplashScreen內用),所以它們的關係是Association。

  5. SplashScreen和MenuScreen是Class,Screen是interface,所以它們的關係是Realization。

以下是LibGDX-Splash Screen程式執行的結果:


1 - DesktopLauncher

Splash Screen過開埸畫面

DesktopLauncher是PC Desktop的Starter Class,我們在DesktopLauncher內設定顯示的大小為459x600px。

2 - MyDemo17 extends Game

第15節 - @Override的用法和意思介紹過在MyDemo15內必須把create()方法定義內容。

Splash Screen過開埸畫面
  1. ApplicationListener是一個interface,所有方法必須是抽象方法,則是內容沒有{......}的,所以create()尚未定義。

    在Game abstract class內create()也未定義內容,所以在MyDemo15 class內必須定義內容。

  2. 在Game abstract class內resize(), render(), pause(), resume()和dispose()已經定義了內容,所以在MyDemo15 class內可以覆寫或不覆寫,以上例子就覆寫所有resize(), render(), pause(), resume()和dispose()方法。

  3. 最後,我們用MyDemo15 class 繼承Game abstract class是因為Game內有兩個新方法:

    setScreen(Screen screen);
    getScreen(Screen screen);


    setScreen()方法可以用來轉換畫面,例如在第15節 - @Override的用法和意思我們介紹過埸畫面(Splash Screen)的做法。

注意,我們把第15節的MyDemo15改為MyDemo17,MyDemo17.java的程式如下:

Splash Screen過開埸畫面
  1. 把MyDemo17 extends Game。

    在Game abstract class內create()也未定義內容,所以在MyDemo17 class內必須定義內容。

  2. 定義create()方法,在create()方法內用setScreen()方法把畫面跳到splashScreen。

3 - SplashScreen implements Screen

進入splashScreen後,我們須要一個Game物件,因為Game物件有我們須要的setScreen()方法,把畫面由splashScreen跳到menuScreen。

以下會介紹4個方法,方法1和2是可行的,方法3和4是不可行的,它們只是用作解釋。

方法1 - setScreen(Screen screen)內傳入Game物件(this)

方法1是在setScreen(Screen screen)方法內傳入SplashScreen物件(splashScreen),然後在splashScreen Constructor內傳入Game物件(this):

setScreen(splashScreen(this));

Game類別內的setScreen(Screen screen)方法預設須要傳入一個Screen物件(例如:splashScreen)。

因為在splashScreen畫面內我們要再把畫面跳到menuScreen畫面,所以我們須要傳入一個Game的物件(例如:game)。

Splash Screen過開埸畫面
  1. MyDemo17是繼承Game類別,所以MyDemo17也是Game類別,它有setScreen()方法。
    每一個類別內,Java預設一個"this"keyword,this相等於這個類別的物件。
    MyDemo17內的"this"=MyDemo17類別的物件=Game類別的物件(例如:game)。

  2. 把this傳入splashScreen Constructor內。

  3. 在SplashScreen內建立一個新的Game的物件(例如:game),它是用來傳取this物件。
    this.game=game;

  4. 在SplashScreen內建立好game物件後,SplashScreen內就可以用setScreen()方法。
    game.setScreen(menuScreen);

  5. 在SplashScreen內再把畫面跳到menuScreen畫面。

  6. 在render()方法內把texture物件顯示在屏幕上。

方法2 - 用getApplicationListener()方法

方法2是用LwjglApplicaiton.java內的getApplicationListener()方法,它會回傳一個ApplicationListener物件。

然後我們再把ApplicationListener物件Casting做Game物件(game)。

以下是LibGDX的官方文件-LwjglApplicaiton.java:

Splash Screen過開埸畫面
  1. LwjglApplicaiton.java是Desktop PC的backend,則是如果把LibGDX程式在電腦上執行,我們就須要執行DesktopLauncher Starter,DesktopLauncher內就須要用到LwjglApplicaiton backend。

  2. LwjglApplicaiton.java內有getApplicationListener()方法,它會回傳一個ApplicationListener物件。

以下是用getApplicationListener()的方法:

Splash Screen過開埸畫面
  1. 這次不是把Game物件傳入splashScreen Constructor內,而是直接在splashScreen類別內import Gdx Class,再在Gdx>Application(app)>getApplicationListener()方法。

  2. 把splashScreen傳入setScreen() 內。

    注意,這次不須要傳入Game物件(this)。

  3. 因為Game類別是實作ApplicationListener介面,所以我們可以把ApplicationListener物件Casting做Game物件(game)。

    import Gdx類別後,就可用到Gdx.app.getApplicationListener()方法。

  4. 有了Game物件,我們就可以用setScreen()方法。

  5. 在render()方法內把texture物件顯示在屏幕上。

方法3(不可能的方法) - 在MyDemo17內import ApplicationListener物件

注意,方法3是不可能的,我會解釋為甚麼不可能。

假設在MyDemo17內import ApplicationListener介面,再用"new"產生一個ApplicationListener 物件(applicationListener),然後把ApplicationListener物件 Casting 做Game物件,最後用game.setScreen(MenuScreen)把畫面跳到menuScreen畫面。

Splash Screen過開埸畫面

大家可以發現ApplicaitonListener是一個介面(interface),它是沒有Constructor的,所以沒有"New"來產生物件。

ApplicationListener applicationListener = new ApplicationListener();是不可以的。

方法4(不可能的方法) - 在SplashScreen內import Game物件

注意,方法4和方法3相似,方法4也是不可能的,我會解釋為甚麼不可能。

假設在SplashScreen內import Game類別,再用"new"產生一個Game物件(game),然後用game.setScreen(MenuScreen)把畫面跳到menuScreen畫面

Splash Screen過開埸畫面

大家可以發現Game是一個abstract class,它是沒有Constructor的,所以沒有"New"來產生物件。

Game game = new Game();是不可以的。

4 - MenuScreen implements Screen

當splashScreen畫面跳到menuScreen畫面後,就會停在menuScreen畫面,如下圖:

Splash Screen過開埸畫面
  1. 以上例子只簡單顯示一張圖片,所以MenuScreen Constructor不須要傳入一個Game物件。

  2. 只簡單顯示一張圖片,把圖片(menuscreen.png)的中心對齊World Coordinate的中心位置(0,0)。

我們可以在menuScreen裡建立不同選擇按鈕,例如:Start, Option, Credit, Facebook等等,方法是在MenuScreen類別內再傳入Game物件,再用setScreen()方法跳到其他畫面,我會在其他章節詳細介紹,概念如下圖:

Splash Screen過開埸畫面

5 - Scene2D-Stage,Group,Actor,Image和Texture的關係

最後,要做到開埸畫面逐漸呈現的效果(Fade in),我們可以用Stage Class, Actor Class, Image Class。

Stage是一個舞台,在舞台內可以有不同的Actor(演員),而Image(圖像)也是Actor的一種。

Stage內還有一個addAction()方法,這個方法就可以用來把開埸畫面做出逐漸呈現的效果。

有關Stage,Group,Actor,Image和Texture的詳細解釋,請閱讀第16節 - LibGDX: Scene2D-Stage, Group, Actor, Image和Texture的關係

Splash Screen過開埸畫面
  1. 用Texture產生一個Texture物件(例如:texture)然後把圖片(splashScreen.png)傳入。

  2. 用Image產生一個Image物件(例如:image)然後把texture物件傳入。

  3. 在show()方法內,把image加入Stage舞台內,再用Stage內還有一個addAction()方法把開埸畫面做出逐漸呈現的效果。

    1-Actions.alpha(0)-設定alpha=0,則把image設定為全透明。
    2-Actions.fadein(0.5f)-把image做出逐漸呈現的效果。
    3-Actions.delay(2)-把動作延遲2秒。
    4-Actions.run()-把現時splashScreen畫面跳到menuScreen畫面。

  4. show()方法會設定所有動作,但尚未顯示在屏幕上,我們必須在render()方法內用輪入:

    1-stage.act();-更新所有Actor。
    2-stage.draw();-把所有Actor顯示在屏幕上。
Download above code and sample pictures here!