2011-02-04 4 views
2

enter image description here공식 Twitter 앱에있는 버튼을 어떻게 재연 할 수 있습니까?

트위터 앱 하단에있는이 스크린 샷 (업데이트 및 취소)에서 어떻게 두 개의 버튼을 재현합니까? Facebook 메시지를 작성할 때도 공식적인 Facebook 앱에서 비슷한 디자인 패턴을 볼 수 있습니다. 그것들은 9 가지 패치 이미지로 만들어 졌는가 아니면 배경색을 설정하고 국경/국가 프레스 색의 변화를 주황색으로 유지하는 것보다 쉽습니다.

트위터가 공개적으로 안드로이드 애플 리케이션을 오픈 소스로 제공했다면 그들은 그렇게 할 수 있다고 말했던 것처럼 정말 간단 할 것이다.

답변

1

좋아, 9 패치 thanks to this question을 사용하지 않고 비슷한 점을 발견했습니다.

스크린 :

enter image description here

활동 레이아웃 (단지 저부)

<LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="0.75dp" 
     android:background="@color/grey" 
     > 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="60dip" 
     android:orientation="horizontal" 
     android:background="@color/NavyBlue" 
     > 
      <!-- Buttons --> 
      <Button 
       android:id="@+id/btn_UpdateAlert" 
       android:text="Update Alert" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:background="@drawable/button" 
       android:textColor="@color/CarolinaBlue" 
       android:textStyle="bold" 
       android:layout_marginBottom="10dp" 
       android:layout_marginTop="10dp" 
       android:layout_marginLeft="10dp" 
       android:layout_marginRight="5dp" 
       /> 
      <Button 
       android:id="@+id/btn_Cancel" 
       android:text="Cancel" 
       android:layout_width="0dp" 
       android:layout_height="wrap_content" 
       android:layout_weight="1" 
       android:background="@drawable/button" 
       android:textColor="@color/CarolinaBlue" 
       android:textStyle="bold" 
       android:layout_marginBottom="10dp" 
       android:layout_marginTop="10dp" 
       android:layout_marginLeft="5dp" 
       android:layout_marginRight="10dp" 
       /> 
    </LinearLayout> 

그리기 버튼 : 입술/그리기/button.xml :

<?xml version="1.0" encoding="utf-8"?> 
<selector 
    xmlns:android="http://schemas.android.com/apk/res/android"> 

    <item android:state_pressed="true" > 
     <shape> 
      <gradient 
       android:startColor="@color/yellow1" 
       android:endColor="@color/yellow2" 
       android:angle="270" /> 
      <stroke 
       android:width="0.75dp" 
       android:color="@color/grey" /> 
      <corners 
       android:radius="10dp" /> 
      <padding 
       android:left="10dp" 
       android:top="10dp" 
       android:right="10dp" 
       android:bottom="10dp" /> 
     </shape> 
    </item> 

    <item android:state_focused="true" > 
     <shape> 
      <gradient 
       android:endColor="@color/orange1" 
       android:startColor="@color/orange2" 
       android:angle="270" /> 
      <stroke 
       android:width="0.75dp" 
       android:color="@color/grey" /> 
      <corners 
       android:radius="10dp" /> 
      <padding 
       android:left="10dp" 
       android:top="10dp" 
       android:right="10dp" 
       android:bottom="10dp" /> 
     </shape> 
    </item> 

    <item>   
     <shape> 
      <gradient 
       android:endColor="@color/NavyBlue" 
       android:startColor="@color/NavyBlue" 
       android:angle="270" /> 
      <stroke 
       android:width="0.75dp" 
       android:color="@color/grey" /> 
      <corners 
       android:radius="10dp" /> 
      <padding 
       android:left="10dp" 
       android:top="10dp" 
       android:right="10dp" 
       android:bottom="10dp" /> 
     </shape> 
    </item> 
</selector> 
관련 문제