C# 스크립트에서 변수를 여러 개 선언하게 되면,


유니티에서 Inspector내 스크립트에 줄줄이 나온다.(public으로 선언했을 경우)


그런데 이 변수가 어떤 기능을 하는 것인지 까먹어 C# 스크립트로 들어가서 코드를 리뷰할 때가 있다.


이런 것을 방지하기 위해 유니티에서는 Tooltip을 제공한다.



[Tooltip("이것은 넘버1이다.")]
    public GameObject number01;

이렇게 작성하면,

 

이렇게 마우스를 갖다대면 설명이 나온다.


그래서 스크립트로 돌아가서 확인하지 않아도 되므로 주석과 더불어 프로젝트 시 사용할 수 있다.

Posted by sungho88
,

유니티에서 현재 활성화(Active) 된 씬 정보를 불러오는 것은


SceneManager.GetActiveScene()


이다. 그리고 그 씬의 이름을 알고 싶다면


SceneManager.GetActiveScene().name


으로 하면 된다.



Posted by sungho88
,

- Input.GetMouseButtonDown : 마우스 버튼을 누른 순간


뒤에 소괄호 안에 숫자 0, 1, 2에 따라 마우스 왼쪽버튼, 오른쪽버튼, 휠버튼으로 나뉜다.


누른 순간 true로 변환되며, 아무것도 안 했을 때 기본적으로 false로 구분됨. 


using UnityEngine;
using System.Collections;

public class ExampleClass : MonoBehaviour { void Update() { if (Input.GetMouseButtonDown(0)) Debug.Log("Pressed left click."); if (Input.GetMouseButtonDown(1)) Debug.Log("Pressed right click."); if (Input.GetMouseButtonDown(2)) Debug.Log("Pressed middle click."); } }

OnMouseDown() 보다는 Input.GetMouseButtonDown()을 추천한다.


그 이유는 



    void OnMouseDown()
    {
        print("OnMouseDown~~");
    }

    void Update () {
        if (Input.GetMouseButtonDown(0))
        {
        print("Input.GetMouseButtonDown!!");
        }
    }


이렇게 하고 실행을 해보니, 이유는 모르겠으나 


Input.GetMouseButtonDown!!만 게속 출력되고, OnMouseDown은 실행이 되지 않는다.


또한,


OnMouseDown() 함수는 모바일에서 적용되지 않는다.

 

Posted by sungho88
,

유니티에서 쿨타임(쿨다운?) 기능을 사용하려고 한다.


RPG 게임에서 어떤 스킬을 사용했을 때, 


사용 후 일정 시간동안 못 쓰게 되고 일정 시간이 지난 후 다시 사용할 수 있게 된다.


[사용 방법]


하나 예제를 만들어보자..


Canvas - UI - Button으로 버튼을 생성한다.


Button을 클릭해보면, Image와 Button 컴포넌트가 기본적으로 만들어진것을 볼 수 있다.


[image 컴포넌트]


Source Image를 통해 버튼의 이미지 모양을 원하는대로 바꿀 수 있다. 

(Sprite 타입 이미지만 사용 가능)


버튼 이미지를 설정 후 Image Type을 Filled로 바꾸면 하위 항목이 다음과 같이 나온다.


여기서 Fill Amount 슬라이더가 생기는데, 


이 슬라이더 값을 0에서 1로 조절하면 버튼 이미지가 이에 따라 채워지는 영역이 변한다. 


이 값을 업데이트 해주면 쿨타임 버튼이 되는 것이다.


참고로,  


Fill Method를 통해 쿨타임의 형태를 바꿀 수 있고,

Fill Origin을 통해 쿨타임의 시작점(원점)을 바꿀 수 있다.


<Fill Method>

  1. Horizontal : 수평으로 쿨타임 적용. 
  2. Vertical : 수직으로 쿨타임 적용.
  3. Radial 90 : 90도로 쿨타임 적용.
  4. Radial 180 : 180도로 쿨타임 적용.
  5. Radial 360 : 360도로 쿨타임 적용.
Fill Origin은 어디서 쿨타임이 시작될 것인지 지정하는 것인데, 위 5가지에 따라 달라진다.


Fill Amount 슬라이더 값을 움직여보면 버튼이 사라지는 것을 볼 수 있다.


이것은 배경은 자동으로 만들어지지 않기 떄문에 사라지는 것처럼 보인다.


즉, 버튼 뒤에 동일한 위치에 배경을 깔아줘야한다.


그리고, Color를 원하는 색상으로 설정해보자. 다음과 같이 된다.




참고로, 빨간 배경을 버튼 위에 놓아야한다.


왜냐하면 Canvas 안에서는 순서대로 겹쳐서 쌓이는 계층구조이므로


빨간 배경이 버튼보다 아래 위치하면 빨간색이 보여지게 된다.


이제 게임 도중에 값을 변화하도록 스크립트를 작성해보자.


Create > C# Script로 스크립트를 하나 생성한다. 이름은 CoolTimeScript.cs로 생성했다.


[CoolTimeScript.cs]


public class CoolTimeScript : MonoBehaviour {
    public Image image;
    public Button button;
    public float coolTime = 10.0f;
    public bool isClicked = false;
    float leftTime = 10.0f;
    float speed = 5.0f;
    
    // Update is called once per frame
    void Update () {

        if(isClicked)
            if (leftTime > 0)
            {
                leftTime -= Time.deltaTime * speed;
                if(leftTime < 0) {
                    leftTime = 0;
                    if(button)
                        button.enabled = true;
                    isClicked = true;   
                }

                float ratio = 1.0f - (leftTime / coolTime);
                if(image)
                    image.fillAmount = ratio;
            }
    }

    public void StartCoolTime() {
        leftTime = coolTime;
        isClicked = true;
        if(button)
        button.enabled = false// 버튼 기능을 해지함.
    }
}



다음과 같이 작성한다.


유니티 On Click에서 버튼을 눌렀을 때 StartCoolTime()을 실행시키도록 하고,


Image와 Button은 버튼에 동일한 위치에 존재하는 컴포넌트를 집어넣어 주면 된다.

speed를 통해 쿨타임 시간을 조절할 수 있다.





Posted by sungho88
,

<button onclick="myFunction()">Try it</button>


<p id="demo"></p>

<script>
function myFunction() {
var str = "Hello World!";
var res = str.toUpperCase();
document.getElementById("demo").innerHTML = res;
};
</script>


ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

<p id="demo"></p>


<script>


function myFunction() {


var str = "HELLO MY NAME IS ...UMM";

var res = str.toLowerCase();


document.getElementById("demo").innerHTML = res;

};

</script>



윗쪽 코드가 모든 문자열을 대문자로 변환하는 toUpperCase() 함수고,

아래 코드가 모든 문자열을 소문자로 변환하는 toLowerCase();함수이다.


또한, 스크립트는 버튼 Try it을 눌렀을 때 일어나는 버튼 클릭 이벤트 onClick을 정의하였다.


결과는 


HELLO WORLD!

hello my name is ...umm




당연한 것이지만, 한글이나 숫자에는 전혀 영향을 미치지 않는다. 에러가 아니라 무시된다



Posted by sungho88
,

<input>의 경우 input 뒤에 한 칸 띄우고 속성을 작성했다.


하지만, Jade의 경우 


<>를 안쓰기 때문에 속성을 어디에 넣어야하는지 난감했다.


하지만 방법은 있었다.


태그명 뒤에 괄호()를 넣어 그 안에 속성을 넣을 수 있다.


placeholder를 사용하고 싶었기 때문에 다음과 같이 작성했다.

input(placeholder="Search for...").input#inputWord

또한 콤마를 이용하여 여러개의 속성도 역시 사용이 가능하다



input(placeholder="Your name" name="username" value=username)



Posted by sungho88
,

코드를 짤때, 필드를 public으로 해야할지, private로 해야할지 고민할 때가 있다.


public으로 했다가 잘못된 값이 입력되어 프로그램이 원치않는 동작이 일어날 수도 있다.


그래서 private로 하려고 하니... 해당 클래스에서만 사용이 가능해서 다른 클래스에서 사용하기 어렵다.


은닉화되어있는 private 변수를 사용하는 방법은 겟/셋 함수를 사용하는 것이다.


자바에서도 


private String name;


public String GetName() {

    return name;

}

public void SetName(String name) {

    this.name = name;

}


이렇게 이름을 갖고,


getName() 사용할 경우 name의 값을 얻을 수 있고,


수정하려면 setName() 메소드를 통해 변경을 할 수 있다.


유니티 C#에서는 더욱 간단한 방법을 제공한다.


    class People

    {

        private string name; 

 

        public string Name

        {

            get

            {

                return name;

            }

            set

            {

                if (value.Length > 3)

                    Console.WriteLine("이름은 3자 이상 넘을 수 없습니다.");

                else

                    name = value;

            }

        }


 

이렇게 하면 get은 GetName() 메소드를 대체한다. 즉, 속성 값 name을 반환하는데 사용된다.


 set 접근자는 SetName(String name)을 대체한다.


반드시 다 써야할 필요는 없고 둘 중 한가지만 사용해도 문제가 되지 않는다.


당연히, get접근자 하나만 사용하면 읽어오는 것밖에 할 수가 없고.. set접근자만 사용하면 쓸 수밖에 없다.


 



Posted by sungho88
,

express를 사용시 제이드(Jade)를 사용하여 웹 페이지를 만들때가 있다.

 

express는 템플릿 엔진을 이용해서 웹페이지를 생성하는데 제이드(Jade)가 대표적이다.


이번 글에서는 express에서 Jade 템플릿을 이용한 웹페이지 렌더링 방법에 대해 알아보려고 한다.


Jade 템플릿을 설치하는 방법은 매우 간단하다.


$npm install jade --save


설치한 Jade 모듈을 익스프레스에 설정하는 코드를 추가한다.


[app.js]에


app.set('views', path.join(__dirname, 'views'));

app.set('view engine', 'jade');



Jade 문법

views 폴더에 생성되는 파일

1. index.jade

extends layout

block content
  h1 This is h1
  p Welcome to Hell

첫 줄의 extends 키워드는 다른 파일을 상속한다는 의미이다. 

2. layout.jade

doctypehtml

html
  head
    title This is title!
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

layout.jade 파일에도 body 밑에 block content가 존재한다..

정리하면,

index.jade에서 block content라고 선언을 하고 작성한 코드들은,
layout.jade에서 block content라고 선언한 직후 호출이 된다.

다시말하면,

layout.jade 파일에서 block content라고 선언만 하고, index.jade 파일에서 block content를 정의한다고 할 수 있다.
 

doctypehtml

html
  head
    title This is title!
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    h1 This is h1
    p Welcome to Hell
 
최종적으로 이렇게 되어 실행될 것이다.


////////////////////


Jade만의 특수 태그가 몇 가지 존재하며, 이 특수 태그를 사용하여 페이지를 구성한다.


1. -Code : 자바스크립트 코드를 입력할 때 사용한다.


2. #{Value} : 데이터를 출력한다.


3. = Value : 데이터를 출력한다.


            -for(var i = 0 ; i < data.length ; i ++)

            { 

a(href = "http://www.naver.com") 이동하기 : p #{i}

           -}


이렇게 하면, -을 사용해서 자바스크립트를 정상적으로 사용할 수 있고,

 #{i}를 사용해서 값을 출력할 수 있다. 0 , 1 , 2 , 3 , ...


[결과]


이동하기 : 0

이동하기 : 1

이동하기 : 2

이동하기 : 3

...
..
.


4. div 태그 생성하기


div 태그를 직접 입력하지 않고 #header 태그를 입력하는 것만으로도 : id 속성이 header인 div 태그를 생성.

div 태그를 직접 입력하지 않고 .header 태그를 입력하는 것만으로도 : class 속성이 header인 div 태그를 생성.


body

  #header 

h1 Hello World!

h2 Mr.Jang.


이와 같이 div 태그를 쓰지 않고도 쉽게 생성할 수 있다.

Posted by sungho88
,
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class Drag : MonoBehaviour, IDragHandler
{

float distance = 10.0f;
public void OnDrag(PointerEventData eventData)
{
Vector3 mousePosition = new Vector3(Input.mousePosition.x,
Input.mousePosition.y, distance);
transform.position = mousePosition;
}

}


1. 드래그를 하기 위해서는 OnMouseDrag() 함수도 있지만, OnDrag() 함수를 사용할 수도 있다.

2. 먼저, OnDrag()를 사용하기 위해서는 


using UnityEngine.EventSystems; 


을 적어줘서 이벤트 시스템을 사용하겠다는 것을 표기한다.


3. MonoBehaviour뒤에 콤마(,)를 쓴 뒤 IDragHandler를 작성한다. 참고로 IDragHandler 는 인터페이스이다.


4. 3번 IDragHandler를 적으면 에러난다. 즉, 인터페이스에 선언된 메소드를 정의해줘야한다.

형태는 다음과 같다. public void OnDrag(PointerEventData eventData)


5. OnDrag()안에 드래그 했을 때, 일어날 동작들을 적으면 된다. 

이 블로그에서는 마우스 드래그하는데로 오브젝트가 딸려오는 것을 구현하려고 한다.


 


마우스는 평면으로 움직이므로  (x,y)축만 필요하다.


z축은 위와 같이 10으로 지정해줘도 되고, 그냥 오브젝트의 z축을 그냥 기입해도 된다.


그 다음에 transform.position에 mousePosition을 넣음으로써,


드래그할때 mousePosition이 게임오브젝트 위치에 대입되어 마우스 드래그할때 오브젝트가 딸려 움직이게 된다.


이상으로 마우스 드래그를 이용하여 게임오브젝트를 움직이는 방법을 알아보았다.


Posted by sungho88
,

스크린 좌표와 월드 좌표의 혼란때문에 머리가 복잡하다.


월드좌표로 하고 있는데 갑자기 스크린 좌표로 코드가 설정되었는지 이상해지고 있다.


예를 들어, 어떤 플레이어 캐릭터가 센터(0,0)에 있다고 가정하자.


그리고 적 캐릭터가 화면에서 플레이어를 향해 돌진한다.


이렇게 할 경우 플레이어의 위치로 이동하도록 0,0) 했는데


갑자기 왼쪽 하단 구석으로 적들이 몰려가서 바글바글거린다.


찾아보니 좌표의 문제였다.


참고 블로그 : http://hyunity3d.tistory.com/m/368



1. 월드 좌표계


- 오브젝트의 위치를 나타내는 좌표계로, 화면의 중심을 원점으로(0,0,0)으로 하는 3차원 상대좌표계이다.

- 게임 화면을 투영하는 카메라의 위치와 회전 상태에 따라 달리지므로 화면의 중심이 원점이 100%라고 할 수 없다.


- 스크린 좌표계는 단말기의 화면 좌표계로, 화면의 왼쪽 아래를 원점으로 하는 평면 절대좌표계입니다.

- 마우스 클릭이나 터치는 스크린 좌표계를 이용하여 처리한다. 이 좌표계는 카메라의 위치나 각도와 상관없이 일정하다.


- 뷰 포트 좌표계는 화면에 글자나 2D 이미지를 표시하기 위한 것. 화면 왼쪽


Posted by sungho88
,