'Button'에 해당되는 글 2건

  1. 2011.09.27 Android - Button & Image ( 버튼을 이용한 이미지출력 )
  2. 2011.09.10 Android - EditText 와 Button (에디트텍스트와 버튼의 이벤트처리) (2)

Android - Button & Image ( 버튼을 이용한 이미지출력 )

Android 2011.09.27 15:17

글이 많이 늦었습니다.
교육 듣느라 취업준비하느라 많이 늦었습니다.

오늘은 간단하게 버튼을 이용해서 그림을 출력하는 것을 해보겠습니다.
UI구성은 버튼4개와 이미지뷰1개 텍스트뷰1개 이고
필요한 파일은 아무 이미지파일 4개를 준비하면 됩니다.

버튼에서 쓸 속성은 클릭이벤트처리
setOnClickListener
이미지뷰에 그림을 할당하는
setImageResource
텍스트뷰에 문자열을 할당하는
setText
입니다.


자 그럼 프로젝트를 생성해야겠지요.

Project name : ExamButtonImage
Build Target : Android 2.1
Package name : jsh.android.exambuttonimage
Create Activity : main
Min SDK Version : 7


프로젝트를 생성하시고 자신이 준비한 이미지파일을 먼저 넣어줍니다.
파일이름은 소문자영어로 Drawable-hdpi에 넣어줍니다.



그 다음 xml로 넘어가서 버튼4개와 이미지뷰 텍스트뷰를 생성합니다.


XML 소스

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <LinearLayout
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:id="@+id/linearLayout1"
  android:orientation="horizontal">
  <Button
   android:id="@+id/button1"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="Button"></Button>
  <Button
   android:id="@+id/button2"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="Button"></Button>
  <Button
   android:id="@+id/button3"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="Button"></Button>
  <Button
   android:id="@+id/button4"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="Button"></Button>
 </LinearLayout>
 <ImageView
  android:id="@+id/imageView1"
  android:layout_gravity="center"
  android:layout_width="200dp"
  android:layout_height="300dp"></ImageView>
 <TextView
  android:text="TextView"
  android:gravity="center"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:id="@+id/textView1"
  android:layout_gravity="center"></TextView>
</LinearLayout>



자바 소스

mainpage.java

package jsh.android.exambuttonimage;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;

public class main extends Activity implements OnClickListener {

 Button bt, bt2, bt3, bt4;
 ImageView iv;
 TextView tv;

 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  // xml에 불러온 이미뷰를 bt에 넣어 속성사용 하기위한 구문
  bt = (Button) findViewById(R.id.button1);
  bt2 = (Button) findViewById(R.id.button2);
  bt3 = (Button) findViewById(R.id.button3);
  bt4 = (Button) findViewById(R.id.button4);

  // 버튼에 클릭이벤트 처리
  bt.setOnClickListener(this);
  bt2.setOnClickListener(this);
  bt3.setOnClickListener(this);
  bt4.setOnClickListener(this);

  // xml에 불러온 이미뷰를 iv에 넣어 속성사용 하기위한 구문
  iv = (ImageView) findViewById(R.id.imageView1);
  // xml에 불러온 텍스트뷰를 tv에 넣어 속성사용 하기위한 구문
  tv = (TextView) findViewById(R.id.textView1);

 }

 @Override
 public void onClick(View arg0) {
  // TODO Auto-generated method stub

  switch (arg0.getId()) {

  case R.id.button1:

   // 이미지뷰에 사진을 출력하는 구문
   iv.setImageResource(R.drawable.test1);
   // 텍스트뷰에 문자열 출력하는 구문
   tv.setText("test1 사진");

   break;

  case R.id.button2:

   iv.setImageResource(R.drawable.test2);
   tv.setText("test2 사진");

   break;

  case R.id.button3:

   iv.setImageResource(R.drawable.test3);
   tv.setText("test3 사진");

   break;

  case R.id.button4:

   iv.setImageResource(R.drawable.test4);
   tv.setText("test4 사진");

   break;

  }

 }
}


실행 결과



실행 결과는
버튼 4개에 연결된 이미지가
버튼을 누를 때 그림과 텍스트가 바뀌면 잘되는 것입니다.

수고하셨습니다.

 

 






 

저작자 표시
신고
크리에이티브 커먼즈 라이선스
Creative Commons License
Trackback 0 : Comment 0

Write a comment


Android - EditText 와 Button (에디트텍스트와 버튼의 이벤트처리)

Android 2011.09.10 15:43

앞에서 살펴본 텍스트뷰와 이미지뷰는 단순한 문자열과 이미지를 출력할 때 쓰입니다.
하지만 스마트폰을 쓰면 페이지가 넘어가거나 문자가 표시되는 동작을 보실 수 있는데요.
에디트텍스트와 버튼 컨트롤은 동작을 시키기 위해 쓰이는 컨트롤 중 하나입니다.
에디트텍스트는 문자열이 출력되는 텍스트뷰와 달리 문자열을 입력하는 컨트롤이며 버튼은 해당 버튼을 눌렀을 때 어떠한 동장이 일어나게 하는 컨트롤입니다.
당연히 값을 할당해줘야 그 값에 해당하는 동작을 발생시킵니다.
아무것도 할당 안하고 배치만 한다면 그냥 보이기만 할 뿐 아무런 동작을 하지 않습니다.


버튼의 속성

텍스트뷰나 이미지뷰의 속성과 같은 속성도 있고 비슷한 속성이 많습니다.

Background
 버튼의 배경을 지정합니다.

이것 외에 다른 컨트롤 속성의 위치 지정이나 정렬 이정도 밖에 안써본듯합니다.


에디트텍스트의 속성

hint
 이 속성은 문자열을 입력하기전에 칸에 입력되 있는 값을 설정하는 것입니다.
 예를 들면 ` 아이디 ` 또는 ` 패스워드 ` 등 사용자가 입력할 정보를 알려주는데 쓰입니다.

InputType
 단어에서 할 수 있듯이 에디트텍스트에 입력할 타입을 지정할 수 있습니다.
 숫자를 지정하면 숫자만 입력하게 설정됩니다.

singleline
 한줄로만 입력하게 만드는 속성으로 Ture값을 설정하면
 글씨가 넘어가도 한줄로만 입력되게 됩니다.

maxlength
 입력되는 글자수를 제한합니다. 공백포함 특수문자 포함입니다.


이것 외에도 많은 속성이 존재하며 컨트롤마다 비슷한 속성이 많습니다.
실습이나 다른 컨트롤도 다루다 보면 똑같은 속성도 발견하실 수 있습니다.


여기서 다루어볼 실습은
버튼을 눌렀을 때 에디트텍스트에 입력한 글자를 텍스트뷰에 출력하는 실습을 해보겠습니다.


자 그럼 먼저 프로젝트를 생성합니다.

Project name : ExamButton
Build Target : Android 2.1
Package name : jsh.exam.button
Create Activity : main
Min SDK Version : 7


xml소스 부분입니다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 xmlns:android="http://schemas.android.com/apk/res/android">
 <EditText
  android:id="@+id/editText1"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:hint="나이를 입력하세요"
  android:singleLine="true"
  android:maxLength="3"
  android:inputType="number"></EditText>
 <Button
  android:text="Button"
  android:id="@+id/button1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"></Button>
 <TextView
  android:text="TextView"
  android:id="@+id/textView1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"></TextView>
</LinearLayout>


자바소스 부분입니다.

main.java

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class main extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
                
        //xml에 배치한 버튼의 속성을 가져다 쓰기위한 구문
        Button bt1 = (Button) findViewById(R.id.button1);
                               
        //버튼을 클릭했을때 이벤트가 일어나도록 처리
        bt1.setOnClickListener(new Button.OnClickListener() {
         
        //OnClickListener에 필요한 메소드 처리
        @Override
  public void onClick(View arg0) {
   // TODO Auto-generated method stub
         
         //xml에 배치한 에디트텍스트의 속성을 가져다 쓰기 위한 구문
         EditText ed1 = (EditText) findViewById(R.id.editText1);
         
         //에디터박스에 입력받은 문자열을 저장할 공간할당
         String str;
         
         //str에 에디트텍스트의 문자열을 저장
         str = ed1.getText().toString();
         
         //xml에 배치한 텍스트뷰의 속성을 가져다 쓰기위한 구문
            TextView tv1 = (TextView) findViewById(R.id.textView1);
         
            //str에 저장된 문자열을 텍스트뷰에 출력
         tv1.setText(str);
   
  }       
        });
    }
}


실행결과 화면입니다.



결과화면에서 볼 수 있듯이 실행화면에서 Hint 속성에 값을 준 나이를 입력하세요라는 문구를 확인 할 수 있습니다. 또한 에디트텍스트를 클릭하면 해당 텍스트는 사라지고 입력할 수 있게 바뀌는 걸 볼 수 있습니다.
그리고 입력하는 문자 제한을 숫자와 3글자이내 로 속성을 주었기 때문에 숫자외에 문자를 입력할 수 없고 3글자이상 입력할 수 없는 것도 확인하실 수 있습니다.
다른 속성값을 지정해보면서 실습해보시면 좋을 것 같습니다.

 

 

 

저작자 표시
신고
크리에이티브 커먼즈 라이선스
Creative Commons License
Trackback 0 : Comments 2
  1. a 2012.08.01 18:27 신고 Modify/Delete Reply

    ctrl+v 안되게 해놨네요ㅡㅡ
    왜올림?

  2. ㅄ아 2013.01.16 17:31 신고 Modify/Delete Reply

    텍스트파일받아서해 그럼
    ㅄ아

Write a comment