앞에서 설명한 버튼 사용법 4가지를 하나의 프로젝트에 포함시켜 보았습니다.
그리고 이미지를 이용한 버튼 생성도 추가를 했습니다.
사용된 layout 구성은 ConstraintLayout
을 이용 하였고 버튼 위치는 editor가 아닌 수작업으로 위치를 표시 하였습니다.
1. 버튼 위치 잡기
1.1 text button
app:layout_constraintTop_toTopOf="parent"
– 이걸로 위쪽 기준을 잡아줍니다.
android:layout_marginTop="76dp" –
위에서 잡은 기준으로 부터 76dp 떨어진 위치에서 시작합니다.
그럼 좌측도 동일하게…
app:layout_constraintLeft_toLeftOf="parent"
– 이걸로 좌측 기준을 정해야 합니다.
android:layout_marginLeft="50dp" - 정해진 좌측 기준으로 부터 50dp
만큼 떨어진 위치에서 시작..
1.2 Image button
app:layout_constraintLeft_toLeftOf="parent" - image도 동일하게 기준을 잡아 줍니다.
android:layout_marginTop="450dp"
– 잡아준 기준으로 부터의 거리에 image를 위치 합니다.
android:src="@drawable/battery_charging_18dp"
– 이건 이미지 위치
android:padding="0dp" – 이미지
여백. 0이면 여백이 없어 이미지 자체가 여백이 있어야 한다.
2. 이미지 버튼
2.1 이미지 + 텍스트
android:drawableXXX를 이용하여 구현해 보았습니다.
drawableLeft, drawableRight, drawableTop...
등등이 있으니 필요한 기능을 사용해 봅시다.
2.2 이미지 버튼
<ImageButton /> 태그를 이용하여 이미지 위치(android:src="@drawable/battery_charging_btn")를 정해 줍니다.
3. 기존 구현 버튼 모음
[android] 안드로이드 버튼(1) onClick() 함수 사용 방법
[android] 안드로이드 버튼(2) 생성시 OnClickListener 구현 방법
[android] 안드로이드 버튼(3)
OnClickListener 인터페이스 구현 방법
[android] 안드로이드 버튼(4) OnClickListener를 객체로
선언하여 구현하는 방법
4. Source Code
4.1 결과 화면
4.2 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="@+id/btn_onclick1"
android:text="@string/btn_click1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="50dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:onClick="btnClick"/>
<Button
android:id="@+id/btn_onclick2"
android:text="@string/btn_click2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="100dp"
android:layout_marginTop="50dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:onClick="btnClick"/>
<Button
android:id="@+id/btn_onclick3"
android:text="@string/btn_click3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="200dp"
android:layout_marginTop="50dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:onClick="btnClick"/>
<Button
android:id="@+id/btn_listener1"
android:text="@string/btn_listen1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_listener2"
android:text="@string/btn_listen2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="130dp"
android:layout_marginTop="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_listener3"
android:text="@string/btn_listen3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="250dp"
android:layout_marginTop="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_implements1"
android:text="@string/btn_implement1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="150dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_implements2"
android:text="@string/btn_implement2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="125dp"
android:layout_marginTop="150dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_implements3"
android:text="@string/btn_implement3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="245dp"
android:layout_marginTop="150dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_object1"
android:text="@string/btn_object1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginTop="200dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_object2"
android:text="@string/btn_object2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="140dp"
android:layout_marginTop="200dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_object3"
android:text="@string/btn_object3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="260dp"
android:layout_marginTop="200dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/btn_imgtext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="88dp"
android:layout_marginTop="250dp"
android:paddingRight="40dp"
android:drawableLeft="@drawable/battery_charging"
android:drawableRight="@drawable/battery_charging"
android:drawableTop="@drawable/battery_charging"
android:drawableBottom="@drawable/battery_charging"
android:text="@string/btn_img_text"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageButton
android:id="@+id/btn_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="160dp"
android:layout_marginTop="330dp"
android:padding="0dp"
android:src="@drawable/battery_charging_btn"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
4.3 strings.xml
<resources>
<string name="app_name">ButtonTest</string>
<string name="btn_click1">onClick1</string>
<string name="btn_click2">onClick2</string>
<string name="btn_click3">onClick3</string>
<string name="btn_listen1">Listener1</string>
<string name="btn_listen2">Listener2</string>
<string name="btn_listen3">Listener3</string>
<string name="btn_implement1">Implement1</string>
<string name="btn_implement2">Implement2</string>
<string name="btn_implement3">Implement3</string>
<string name="btn_object1">Object1</string>
<string name="btn_object2">Object2</string>
<string name="btn_object3">Object3</string>
<string name="btn_img_text">Image Text Button</string>
</resources>
4.4 drawable image
버튼에 사용한 이미지
4.5 MainActivity.java
package com.example.desk.buttontest;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.support.v4.content.ContextCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageButton;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity
implements Button.OnClickListener // 3. implements 구현 방법
{
// 4. OnClickListener를 객체로 만드는 방법
Button.OnClickListener btnObject = new View.OnClickListener() {
public void onClick(View v) {
if(v.getId() == R.id.btn_object1) {
Toast.makeText(MainActivity.this, "Object Button1", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_object2) {
Toast.makeText(MainActivity.this, "Object Button2", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_object3) {
Toast.makeText(MainActivity.this, "Object Button3", Toast.LENGTH_SHORT).show();
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// 2. Button 생성시 OnClickListner 구현 하는 방법
Button btnListener1 = (Button)findViewById(R.id.btn_listener1);
Button btnListener2 = (Button)findViewById(R.id.btn_listener2);
Button btnListener3 = (Button)findViewById(R.id.btn_listener3);
btnListener1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "Listener Button1", Toast.LENGTH_SHORT).show();
}
});
btnListener2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "Listener Button2", Toast.LENGTH_SHORT).show();
}
});
btnListener3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "Listener Button3", Toast.LENGTH_SHORT).show();
}
});
// 3. MainActivity에 implements View.OnClickListener를 이용한 경우
Button btnImplement1 = (Button)findViewById(R.id.btn_implements1);
Button btnImplement2 = (Button)findViewById(R.id.btn_implements2);
Button btnImplement3 = (Button)findViewById(R.id.btn_implements3);
btnImplement1.setOnClickListener(this);
btnImplement2.setOnClickListener(this);
btnImplement3.setOnClickListener(this);
//image button
Button btnImgtext = (Button)findViewById(R.id.btn_imgtext);
ImageButton btnImg = (ImageButton) findViewById(R.id.btn_img);
btnImgtext.setOnClickListener(this);
btnImg.setOnClickListener(this);
// 4. OnClickListener를 객체로 만드는 방법
findViewById(R.id.btn_object1).setOnClickListener(btnObject);
findViewById(R.id.btn_object2).setOnClickListener(btnObject);
findViewById(R.id.btn_object3).setOnClickListener(btnObject);
}
// 1. onClick 함수를 호출 하는 방법 (activity_main.xml)
public void btnClick(View view) {
if(view.getId() == R.id.btn_onclick1) { // Buttoon의 ID를 찾아서 실행이 된다.
Toast.makeText(this, "onClick Button1", Toast.LENGTH_SHORT).show();
} else if(view.getId() == R.id.btn_onclick2) {
Toast.makeText(this, "onClick Button2", Toast.LENGTH_SHORT).show();
} else if(view.getId() == R.id.btn_onclick3) {
Toast.makeText(this, "onClick Button3", Toast.LENGTH_SHORT).show();
}
}
// 3. MainActivity에 implements View.OnClickListener를 이용한 경우
@Override
public void onClick(View v) {
if(v.getId() == R.id.btn_implements1) {
Toast.makeText(MainActivity.this, "implements Button1", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_implements2) {
Toast.makeText(MainActivity.this, "implements Button2", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_implements3) {
Toast.makeText(MainActivity.this, "implements Button3", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_imgtext) {
Toast.makeText(MainActivity.this, "Image Text Button", Toast.LENGTH_SHORT).show();
} else if(v.getId() == R.id.btn_img) {
Toast.makeText(MainActivity.this, "Image Button", Toast.LENGTH_SHORT).show();
}
}
}
- copy coding -
