평탄한 느낌의 버튼을 만들어 봤어요.

Forsquare의 안드로이드 버전을 모방해 XML로만 해봤어요.
구조를 금방 잊어버리기 때문에 여기에 적어 두세요.
flat_panel.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@+id/padding">
        <shape>
            <solid android:color="#00FFFFFF" />
            <padding android:bottom="8dp" android:left="8dp"
                android:right="8dp" android:top="8dp" />
        </shape>
    </item>
    <item android:id="@+id/shadow">
        <shape>
            <solid android:color="#D3CEC7" />
            <padding android:bottom="2px" />
        </shape>
    </item>
    <item android:id="@+id/face">
        <shape>
            <stroke android:width="1px" android:color="#AEA8A3" />
            <solid android:color="#FFFFFF" />
        </shape>
    </item>
    <item android:id="@+id/state">
        <selector>
            <item android:state_pressed="true">
                <shape android:shape="rectangle">
                    <solid android:color="#FF82DEFF" />
                </shape>
            </item>
            <item android:state_focused="true">
                <shape android:shape="rectangle" >
                    <solid android:color="#4082DEFF" />
                </shape>
            </item>
          </selector>
    </item>
    <item android:id="@+id/child">
        <shape>
            <solid android:color="#00FFFFFF" />
            <padding android:bottom="8dp" android:left="8dp"
                android:right="8dp" android:top="8dp" />
        </shape>
    </item>
</layer-list>

사용법

위의 파일flat_panel.xml을 res/drawable 디렉터리에 넣고 사용하고자 하는 버튼 등에서 ↓처럼 설정합니다.
part_of_activity_main.xml

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/flat_panel"
        android:text="フラットなボタン" />

템 같은 걸로 정리하고 싶지만 오늘은 연애 안 해요.

버튼 결과

일반적

잠시 동안

구조

<layer-list> 태그의 요소는 위에서 순서대로 그려집니다.또 하위(전) 요소는 상위(안) 요소의 삽입인 것 같다.

(그림의 id는 flat panel.xml에 해당합니다.)

padding-버튼 주위에 약간의 공백 작용을 덧붙인다(필요하지 않으면 삭제해도 된다)

shoadow - 버튼 아래에 살짝 보이는 그림자 부분.대부분 페이스에 숨겨져 있지만 실제로는 거의 같은 영역이 있다.여기에 padding bottom을 2px로 하고face의 높이를 2px로 줄여 그림자 구조처럼 보이기 때문이다.그림자의 강도를 여기서 조절하는 것이다.

face-버튼의'면'에 대응합니다.strike로 붕어를 solid로 얼굴에 가득 발랐다.

state-버튼의 상태에 따라 색을 바꾸는 등의 작용.여기는 스테이트.pressed=진짜(눌린 상태)와state-초점이 있는 상태.face가 그려진 '뒤' 에서 평가를 하고 face의 색을 바꾸지 않도록 주의하십시오. (투명할 때)그리고 컨디션은 위에서 평가받는다.

child-LearLayout 등 그룹의 뷰에서 이 스타일을 적용할 때 하위 뷰의 공백이 된다.

여러분들이 가장 좋아하는 체크지 EXCEL과 자동 모양으로 재현 →DL
액티비티 배경이 흰색이면 눈에 잘 안 띄는데...
색상의 정의를 다른 xml로 나누어 응용 프로그램에 따라 바꾸면 감각이 있겠죠.