안드로이드 - 디자인 적용 관련 잡설

<목차로 돌아가기>

순서

바깥부터 안쪽으로 레이아웃을 우선 정리한다.

색깔 알록달록하게 해서 텍스트, 이미지 영역 다른 해상도에서 확인

위젯 삽입 및 디자인

레이아웃

★ 레이아웃 정적으로 비율지정하기.

비율 맞추기 힘드니까 layout_weight으로 맞추면 더 쉽다.

퍼포먼스 상으로는 안좋지만...

상단이 600px  하단이 500px이라면

600/500 =1.2

상단 layout_weight = 1.2

하단 layout_weight = 1

★ 동적으로 레이아웃 비율 지정 

아래속성 이용해서 계산하면됨

ViewGroup.LayoutParams params = convertView.getLayoutParams();

if (params != null) 

{   

    params.height = height;

    convertView.setLayoutParams(params);

}

텍스트 뷰

★ text font와 bold 지정하기

★ 줄간격, 자간, 장평 지정하기

★ 글자 색 지정 

mTextView.setTextColor(Color.parseColor("#bdbdbd"));

에디트 텍스트

★ 밑줄 제거하기

★ 테두리 지정하기. 

act_sub_tablayout_bottom_line.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:left="-5dp"
        android:right="-5dp"
        android:top="-5dp">
        <shape android:shape="rectangle" >
            <stroke
                android:width="2dp"
                android:color="#5681be" />
        </shape>
    </item>
</layer-list>

아래는 레이아웃.

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/act_sub_tablayout_bottom_line"/>

이미지뷰

★ 비율걱정없이 라운딩 처리하기

라운드 버튼 이미지 

-> 마스킹해서 직사각형으로 변환 

-> git round image view 

해당기능 패키지 = git round image view 

★ 이미지 비율유지하고 크랍하기

android:scaleType="fitCenter"

android:adjustViewBounds="true"

★ 이미지 불러오기

Glide 추천

★ 포토샵 없는 라운딩관리

나인패치

리스트뷰 

★ 아이템마다 타이틀 지정

해더 지정해서 컬럼마다 타이틀 지정가능

android:headerDividersEnabled="true"

android:accessibilityHeading="true"

★ 동적으로 리스트 아이템 비율맞추기

if (noticeAdapter.getCount() > 0) {

    lv_MainNoticeList.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {

        @Override

        public void onGlobalLayout() {

            lv_MainNoticeList.getViewTreeObserver().removeOnGlobalLayoutListener(this);

            int height = lv_MainNoticeList.getMeasuredHeight();

            height = (height - (lv_MainNoticeList.getDividerHeight() * noticeAdapter.getCount())) / 3;

            noticeAdapter.setItemHeight(height);

            Log.e("TAG", "ListView Height :: " + height);

        }

    });

}

Speaner View

PlaceHolder 관련