PhoneGap - 레이아웃 변경하기 (Layout Custom)

PhoneGap 을 사용했을 때 Activity 구성시 기본적으로 DroidGap 을 extends 하게 되는데, DroidGap 소스의 onCreate 를 보면 WebView 를 통으로 만들도록 되어 있다. 이를 말 그대로 Hybrid 로 구성(네이티브 버튼+웹뷰) 하기 위하 많은 고민을 했고, 구글의 힘을 빌었지만, 국내에 관련 내용은 전무하고, 해외 사이트도 명확한 답변은 없었다. 그래서 PhoneGap 소스를 구해 분석하여 구성하였다. PhoneGap 소스를 구하는 것도 쉽지많은 않더라...

1. 일단, 기존 그대로 DroidGap 을 extends 하면된다. 
2. onCreate 문을 작성한다. 내용은 아래처럼 구성하면 된다.

 

 

 

 

먼저, super.onCreate(savedInstanceState) 를 수행한 후
super.init() 를 수행한다.
init()를 수행하게 되면 전역변수인 appView 가 초기화 된다.
이제 appView 의 레이아웃 구성을 마음대로 꾸미면된다. 물론 코드로!!
나는 상단에 버튼을 넣기 위해 아래와 같이 구성하였다.

appView.setLayoutParams(new LinearLayout.LayoutParams(

                ViewGroup.LayoutParams.FILL_PARENT,

                ViewGroup.LayoutParams.FILL_PARENT, 

                1F));
 

LinearLayout ll = new LinearLayout(this);
ll.setLayoutParams(
       new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
       ViewGroup.LayoutParams.WRAP_CONTENT, 0F));

        

Button btn = new Button(this);

btn.setText("버튼");

btn.setLayoutParams(
       new LinearLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, 64, 1F));

btn.setOnClickListener( new View.OnClickListener() {

public void onClick(View v) {

// TODO Auto-generated method stub

Toast.makeText(Pilot.this, "버튼 클릭", Toast.LENGTH_SHORT).show();

}

});

ll.addView( btn);

       

root.removeAllViews();

root.addView(ll);

root.addView(appView); 

위와 같이 구성하면 상단에 LinearLayout 이 있고 그 안에 버튼이 들어가며.. 그 하단에 appView 가 추가된 형태가 된다.

 

위와 같이 상단에 버튼, 하단에 WebView 가 나타난다.

위와 같이 코드를 통해 얼마든지 레이아웃 변경이 가능하다. 

root.removeAllViews();  를 수행한 이유는, 레이아웃 순서 바꾸어주려고...
appView는 생성되어 있는 상태이기 때문에 다시 붙이면 되니 root (이녀석도 LinearLayout이다 ) 의 View 들을 모두 제거해주어도 된다.

도움이 되었길 바라며, 도움이 되었다면 밥 한 번 사던가.. ^^