안드로이드 drawableLeft 크기 - andeuloideu drawableLeft keugi

EditText 왼쪽 icon size 조정

EditText 안에 icon을 넣을 수 있습니다.
또 자주 사용되는 UI 이기도 합니다.
구현을 위해 구글링 해 보면 간단하게 찾아집니다.

android:drawableLeft="@drawable/icon"

오른쪽에 넣기 위해선 drawableLeft -> drawableRight로만 바꾸면 됩니다. 좌, 주 뿐 아니라 위, 아래에도 넣을 수 있습니다.
기쁜 맘으로 적용 해 보면 대부분의 경우 아이콘이 크게 나와서 깜짝 놀라게 됩니다.

이걸 수정하기 위해서 다음과 같은 xml 파일을 만들어서 적용하면 Android Studio 안에서는 제대로 보이게 됩니다.

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:src="@drawable/ic_id"
android:scaleType="fitXY">
</bitmap>

물론 위와 같이 수정한 후 drawable 디렉토리에 임의의 파일명으로 저장하고 위의 "@drawable/icon" 의 icon 부분을 해당 파일명으로 변경해야 합니다. 예를 들어서 custom_icon.xml 로 바꿔놨다면 "@drawable/custom_icon" 으로 바꿔넣어야 합니다.

하지만 다시 실행 해 보면 여전히 크게 나오게 됩니다.
여기에 대해서 해결책을 찾아보니 코딩으로 해결을 해야 합니다.

DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
float density = displayMetrics.density;

Drawable ic_id = getResources().getDrawable(R.drawable.ic_id);
Drawable ic_pw = getResources().getDrawable(R.drawable.ic_pw);

int ic_width = Math.round(14 * density);
int ic_height = Math.round(14 * density);

ic_id.setBounds(0, 0, ic_width, ic_height);

((EditText) findViewById(R.id.etId)).setCompoundDrawables(ic_id, null, null, null);

여기서 14는 현재 EditText에 지정되어 있는 Font size 입니다. 적당히 변경 해 주면 됩니다. 좀 더 편하게 적용할 수 있는 방법이 있으면 좋겠습니다.

추가 1 : TextView에도 동일하게 사용할 수 있습니다.

하누라(hanoora) 님을 이웃추가하고 새글을 받아보세요

프로그래밍/안드로이드

[안드로이드/Android Studio] 버튼에 이미지넣기 drawableLeft/Right/Top/Bottom

침착곰 2021. 4. 26. 14:31

안녕하세요

안드로이드 스튜디오[Android Studio]에서 버튼에 이미지를 넣는 방법에 대해서 알아보겠습니다

안드로이드 스튜디오에서는 버튼에 배경화면에 이미지를 넣는 것 말고도 이미지와 텍스트가 같이 보이도록 설정을 할 수 있습니다

버튼 속성의 drawableLeft / Right / Top / Bottom 속성입니다

이 속성의 사용법에 대해서 알아보겠습니다

사용 방법

1. 디자인 xml에 버튼을 추가합니다

2. 버튼에 추가할 이미지를 가져옵니다

 버튼에 추가할 이미지를 복사해서 res - drawable 폴더에 복사합니다

 png 파일을 복사해서 가져왔습니다

3. 버튼의 속성(Attributes)에서 drawable속성에 산 모양을 선택합니다

 저는 텍스트의 하단에 이미지를 추가할 것이므로 drawableBottom 속성에 이미지를 추가하겠습니다

4. 산 모양을 선택하면 이미지 선택 팝업이 나타납니다

 방금 전에 추가한 이미지를 선택합시다!

5. 결과 화면입니다

 버튼 하단에 이미지가 들어간 것까지는 좋지만... 이미지가 너무 큽니다

 이어서 이미지의 크기를 조정하는 방법에 대해서 알아보겠습니다

이미지 크기 조정(추가 tip)

1. drawble에 xml파일을 하나 만듭니다

 ※ xml파일은 소문자만 입력이 가능합니다

  저는 coding_dogxml.xml로 만들었습니다

2. xml에 이미지정보와 크기, 넓이정보를 넣습니다

 하단의 소스를 참고바랍니다

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/coding_dog"
        android:width="60dp"
        android:height="60dp" />
</layer-list>

3. 메인페이지로 넘어가서 button의 drawable 속성을 변경해줍니다

 변경은 방금 추가한 xml파일로 변경합니다

 저는 coding_dogxml.xml 파일을 불러왔습니다

4. 결과화면입니다

 위에서부터 차례대로

 drawableBottom, drawableTop, drawableLeft, drawableRight 속성에 이미지를 추가한 것입니다

 실제 안드로이드 화면에서 왼편과 같이 출력되는 것을 확인할 수 있습니다

여기까지 버튼에 이미지를 추가하는 방법에 대해서 알아봤습니다

이 글이 안드로이드 스튜디오 개발에 있어서 도움이 되셨으면 좋겠습니다!