법선 벡터의 변환을 위한 법선 행렬

3차원에서, 광원에 의한 물체 표면의 표현을 위해 표면에 수직인 법선 벡터를 고려하게 됩니다. 쉽게 생각해 보면, 물체를 구성하는 좌표에 대한 모델뷰 행렬(M)을 이용해 법선 벡터를 변환하는 것으로 충분할듯하지만 아래처럼 어파인(Affine) 변환 중 y축에 대한 크기 변환을 수행했을 경우, 법선 벡터를 모델뷰 행렬로 변환하면, 표면 벡터(S)와 법선 벡터(N)이 더 이상 수직이 아님을 쉽게 알 수 있습니다.

그렇다면 물체에 대해서 어떠한 어파인 변환을 수행하더라도 법선 백터의 고유한 특성, 즉 표면 벡터와 수직인 성질을 유지할 수 있을까하는 것에 대해 정리를 해 봅니다.

먼저 법선 벡터와 표면 벡터는 수직이므로 이 두 벡터의 내적은 0입니다. 즉, 아래와 같습니다.

물체는 모델뷰 행렬에 의해 변환됩니다. 즉, 물체의 표면 역시 모델뷰 행렬에 의해 정확히 변환됩니다. 모델뷰 행렬이 M, 표면 벡터를 S, 변환된 표면 벡터를 S’라고 하면 다음과 같습니다.

위와 같은 맥락으로, 법선 벡터 N이 법선 벡터로써의 특성을 유지하면서 새롭게 변환된 법선 벡터를 N’라고 할때, 법선 벡터로써의 특성을 유지하면서 변환해 주는 행렬, 즉 법선 행렬을 K라고 하면 다음과 같습니다.

법선 벡터의 특성, 즉 변환된 후의 표면 벡터인 S’와 법선 벡터인 N’는 수직이여야 하므로 다음과 같습니다.

S’=MS 그리고 N’=KN이라고 했으므로 바로 위의 식에 각각 대입하면 다음과 같습니다.

벡터의 기본 성질 중, 벡터의 내적의 결과는 첫번째 벡터의 전치에 의한 벡터의 단순 곱과 같으므로 위의 식은 아래와 같습니다.

벡터 곱에 대한 전치는 각 벡터의 전치에 대한 역순의 곱과 같으므로 다음의 첫번째 식과 같습니다.

위의 첫째 식은 순차적으로 2번째와 세번째 식으로 변환이 가능합니다. 위의 식중 세번째 식을 “주식”이라고 하겠습니다. S와 N의 내적의 표현은 S의 전치와 N의 곱과 같고, S와 N의 내적의 결과는 0이므로 다음과 같습니다.

위의 식과 앞서 “주식”이라고 했던 식을 함께 살펴보면, 다음의 결과과 같은 식을 얻을 수 있습니다.

위의 식에서 양변에 M의 전치 행렬에 대한 역행렬을 곱해 주면 최종적으로 K 행렬을 다음처럼 얻을 수 있습니다.

위의 식은 행렬의 기본 성질에 의해 다음과 같습니다.

즉, 어떤 변환(M)에 의해 법선 벡터가 그 고유한 특성을 유지할 수 있는 변환을 위한 행렬인 법선행렬은 모델뷰 행렬의 역행렬에 대한 전치 행렬과 같다는 것을 알 수 있습니다.

[Java] File에 대한 Zip 압축

여러개의 파일들을 하나의 Zip 파일로 압축하는 자바 코드입니다.

String zipFileName = "c:/file.zip";

String[] files = new String[3];

files[0] = "c:/a.so";
files[1] = "c:/b.dat";
files[2] = "c:/c.cfg";
		
byte[] buf = new byte[4096];

try {
    ZipOutputStream out = new ZipOutputStream(new FileOutputStream(zipFileName));

    for (int i=0; i<files.length; i++) {
        FileInputStream in = new FileInputStream(files[i]);
        Path p = Paths.get(files[i]);
        String fileName = p.getFileName().toString();
	        	
        ZipEntry ze = new ZipEntry(fileName);
        out.putNextEntry(ze);
	      
        int len;
        while ((len = in.read(buf)) > 0) {
            out.write(buf, 0, len);
        }
	      
        out.closeEntry();
        in.close();

    }
	      
    out.close();
} catch (IOException e) {
    e.printStackTrace();
}

a.so, a.dat, c.cfg 파일 세개를 file.zip으로 압축합니다. 특히, 19번 코드의 ZipEntry의 생성자의 인자에 경로가 들어갈 경우 압축 파일 내부에도 동일한 경로가 형성됩니다. 코드 최저화는 각자의 몫으로 남겨 둡니다.

참고로 위의 클래스들을 위해 필요한 import 문의 삽입을 위해 이클립스에서는 ^~O (Ctrl+Shift+O)를 입력하시면 됩니다.

jQuery UI를 이용한 대화상자(Dialog) 표시하기

jQuery 라이브러리를 이용한 UI, 즉 jQuery UI에는 기본적인 Button에서부터 Accordion까지 다양한 UI를 제공합니다. 그 중 대화상자(Dialog)에 대해 살펴 보도록 하겠습니다.

흐름은 3가지입니다. 첫째는 Dialog의 기능을 담을 DIV를 선언하고, 두번째는 jQuery와 jQuery UI에 대한 자바스크립트 라이브러리를 추가하고, 세번째는 앞서 선언한 DIV에 대해 dialog() 함수를 호출해 주는 것이 기본적인 내용의 전부입니다.

아래는 jQuery UI를 이용한 다이얼로그에 대한 화면입니다.

위의 화면을 구성하기 위한 전체 코드는 아래와 같습니다.




    
    jQuery UI - DialogBox

    
    
    
    

    


    

Message

앞서 언급한 세가지 흐름에 해당하는 코드는, 첫째인 Dialog의 기능을 담을 DIV를 선언은 20번, 두번째로 jQuery와 jQuery UI에 대한 자바스크립트 라이브러리를 추가는 10번과 11번, 세번째인 앞서 선언한 DIV에 대해 dialog() 함수를 호출해 주는 것은 15번입니다.

jQuery UI는 자바스크립트와 HTML 테그를 이용하여 매우 직관적이고 간단하게 원하는 UI로써의 기능(생명력)을 불어 넣을 수 있는 좋은 라이브러리라고 생각됩니다.

[Android] Spinner 또는 ListView에 Adapter 지정 후 바로 setSelection 호출 제대로 하기

제목도 참 길어 거시기 합니다. 안드로이드에서 Spinner나 ListView에 항목에 대한 목록을 지정하기 위해서는 Adapter 객체를 생성 및 구성해서 setAdapter 함수를 호출하여 지정합니다. 이렇게 지정하고 난 뒤에 바로 n번째 항목을 선택하도록 setSelection(n-1)과 같은 함수를 호출하게 됩니다. 예를 들어 아래와 같은 코드처럼 말입니다.

Spinner spRi = (Spinner)findViewById(R.id.spRi);
ArrayAdapter adp = new ArrayAdapter( ... );

...

spRi.setAdapter(adpr);

int n = ...;

...

spRi.setSelection(n-1);

그러나 이렇게 하면 n번째 항목은 선택되지 않고 항상 첫번째 항목이 선택되어 있습니다. 사용자 인터페이스(UI)에 대한 표현은 다른 연산보다 가장 나중에 처리되는 OS 정책 때문인데요. 이럴때는 아래와 같은 코드로 대신해야 합니다.

Spinner spRi = (Spinner)findViewById(R.id.spRi);
ArrayAdapter adp = new ArrayAdapter( ... );

...

spRi.setAdapter(adpr);

new Handler().postDelayed(new Runnable() {        
    public void run() {
        int n = ...;

        ...

        spRi.setSelection(n-1);
    }
}, 100);

즉, UI의 표현이 될때까지 기다렸다가 n-1 번째 항목을 선택하라는 것인데요.. 기다린다는 것이 100ms라는 애매한 시간으로 지정했다는 것이 걸리지만 잘 작동합니다. 않되면 이 애매한 시간을 더 늘려주세요. 개인적으로 Delay나 Sleep와 같은 기능을 하는 함수 호출을 싫어하지만… 근데 어디선가 지금 바로 UI를 업데이트 하라는 함수를 본 것 같은데 기억이 않난단 말입니다. 메모를 해 뒀어야 했는데 말입니다.

[Android] ListView의 선택 항목에 대한 하이라이팅(Hilighting) 또는 배경색 변경

안드로이드에서 ListView 위젯에 데이터 목록을 표시하고 사용자가 데이터 항목을 터치하면 어떤 항목이 터치가 되었는지에 대한 피드백이 있어야 합니다. 그러나 안드로이드에서는 기본적으로 이러한 피드백을 제공해 주지 않습니다. 이러한 피드백을 제공해주기 위한 절차입니다. 아래는 사용자가 항목을 터치했을 때 앞서 언급한 피드백에 대한 효과에 대한 이미지입니다.

먼저 ListView가 아래처럼 정의되어 있습니다. 항목 선택에 대한 피드백을 위해 특별히 해준 것은 없습니다.

...



...

ListView는 채워질 항목을 위한 레이아웃을 정의하게 되는데요. 이 레이아웃의 배경을 Selector로 지정하는게 키포인트입니다. 바로 아래처럼 말입니다.



    


위의 코드에서 중요한 것은 바로 3번 코드입니다. background를 selector_listview_item으로 지정하고 있는데, 이 selector_listview_item에 대한 XML 코드는 아래와 같습니다.


    
    

위의 코드에서 중요한 부분은 4번과 5번인데요. 5번에서 항목에 대한 상태가 만족될 경우, 즉 state_pressed가 참(true)일 경우에 4번 코드에서 지정한 Drawable를 이용해 그리라는 것입니다. 4번 코드에서 지정한 drawable인 ItemSelectedColor는 color.xml에 다음처럼 정의되어 있습니다.



    #8EE2FB

위의 코드 중 3번에서 지정한 웹 컬러 표현값인 #8EE2FB로 지정됩니다.

항목 선택하면 사용자에게 피드백을 주는 것이 당연한데, 안드로이드는 그렇지 않다는 점.. 분명히, 상당히 불편한 것이 틀림없지만.. 기능에 대한 넓은 확장성과 높은 응용성을 위해 이러한 방식을 취했다.. 생각합니다.