본문 바로가기

프로그래밍/안드로이드

[안드로이드] 이미지뷰(imageView)와 렐러티브 레이아웃(Relative Layout)

※ 저는 안드로이드 프로그래밍 정복(김상형 著, 한빛미디어) 책을 이용해 공부하고 있으며

예제와 코드는 이 책을 통해 공부중임을 밝힙니다.

개인적인 공부를 하면서 정리한 형식이기 때문에 심각한 오류가 있을 수 있습니다. 피드백 주시면 정말 감사하겠습니다.


※ 안드로이드 프로그래밍 정복 165p~167p (명함철 만들기) 참조



App - Src - Main - res - drawable 폴더에 출력할 사진을 드래그한다.



나는 이미 사진이 있었기에, overwrite를 실시함.



그런데 뭐람, 오류가 발생해버렸다. 이 문제를 해결하느라고 20분 동안 시행착오를 겪었다.


문제는 사진파일의 확장자가 문제였다. 


저장한 그림파일의 확장자를 JPG에서 PNG로 변경해주니 해결이 됐다.


이유는 뭔지 모르겠다. 나중에 차근차근 알아가도록 해보자.



이번에는 문제가 사진 크기가 커서 내가 입력한 글자들이 모두 되지 않았다.


그래서 점차 줄여나가니 자리를 잡아가기 시작.


내가 원하는 사이즈만큼의 이미지를 출력하려면 어떡해야 할까? 아직 잘 모르겠다.


ImageView 내에서 maxHeight 값과 maxWidth값을 건드려봤지만 크기는 그대로이다.




전화번호(id/call) : alignBaseline (밑변을 id/name과 맞추기) 했다.


그렇다면 우리가 description이라고 명명한 텍스트는 어떤 것과 맞추었는지 유추해보자.


id/name(홍길동) 밑에 배치했으며(layout_below)

id/name(홍길동)의 왼쪽 변과 나란히 정렬했다.(alignLeft)


그렇다면 이 속성들을 제거해버리면 어떻게 될까?



android:layout_alignBaseline="@id/name" 제거

android:layout_alignLeft="@id/name" 제거


이 두 개의 속성을 제거한 결과, 전화번호(015-123-4567)은 홍길동과 밑변을 맞추고 있지 않고


description에 해당하는 부분이 이미지를 침범하는 것을 알 수 있다.





전체 코드(xml)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:padding="5dip"
>

<ImageView
android:id ="@+id/picture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginRight="5dip"
android:src="@drawable/b"
android:maxWidth="200px"
/>

<Button
android:id="@+id/btnde1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Del"
android:textSize="12sp"
android:layout_below="@id/picture"
/>
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="홍길동"
android:textColor="#000000"
android:textSize="24sp"
android:layout_alignParentTop="true"
android:layout_toRightOf="@id/picture"
/>

<TextView
android:id="@+id/call"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="015-123-4567"
android:textColor="#0000ff"
android:textSize="12sp"
android:layout_alignParentRight="true"
android:layout_alignBaseline="@id/name"
/>

<TextView
android:id="@+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="내가 돈을 벌면 사게 될 차이다."
android:textColor="#000000"
android:textSize="12sp"
android:layout_below="@id/name"
android:layout_alignLeft="@id/name"
/>

</RelativeLayout>


.java 코드

package lkcompany.exercise;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class Exercise extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_exercise);


}
}