안드로이드 학습노트42_다양한 도형의 시크한 효과의 실현과 사용

46741 단어 안드로이드 학습
1. 문서 위치:
android에 있는 도형입니다. 도움말 문서의 이 페이지에 있는 android-sdk-windows\docs\guide\topics\resources\drawable-resource입니다.html
2. 도형 종류:
  2.1 Bitmap:
2.2 Nine-Patch File NinePatch는 특정 영역에서 텍스트 크기에 따라 크기를 조절할 수 있는 유용한 PNG 이미지 형식입니다.아래와 같이 위 그림에서 볼 수 있듯이 배경 그림의 중간 구역은 문자의 크기에 따라 축소된다.배경 이미지는 NinePatch 이미지입니다.NinePatch 그림은android가 자체로 가지고 있는draw9patch 도구를 사용하여 제작할 수 있으며, 이 도구는 SDK 설치 경로의tools 디렉터리에 있습니다.이 도구를 실행하고 'File' -> '오픈 9 -path' 를 누르면 NinePatch 그림을 만드는 데 사용할 원래 그림을 열 수 있습니다.캔버스의 위쪽과 왼쪽 모서리에 선을 그어 줌 영역을 지정하고 [Show patches]를 선택하면 지정된 영역이 표시됩니다. 녹색은 고정 크기 영역이고 빨간색은 줌 영역이며 문자는 빨간색 영역에 배치됩니다.제작이 끝난 후 "File"[save 9-path]를 클릭하여 그림을 저장하면draw9patch 도구는 자동으로 그림에 *.9를 추가합니다.png 접미사.만들어진 그림을 프로젝트의res/drawable 디렉터리에 복사한 다음 코드를 작성합니다.다음과 같습니다.
<TextView android:layout_width="wrap_content" 

    android:layout_height="wrap_content"

    android:text="  " android:textColor="#330000"

    android:background="@drawable/button"/>

Nine-Patch File 같은 그림은 특정한 구역에서 축소를 할 수 있다. 예를 들어 한 그림에 문자가 있고 문자는 그림의 중간 위치에 있고 오른쪽은 재생을 대표하는 삼각 도형이다. 이때 문자가 많아질 때 Nine-Patch File 같은 그림은 중간 위치를 늘려서 더 많은 문자를 지탱할 수 있다.원래 오른쪽의 대표가 재생하는 삼각 도형은 늘어나지 않는다.cmd 명령 인터페이스 입장: G:\android\android-sdk-windows\tools>draw9patch 리턴을 입력하면 9path 그림을 만드는 인터페이스를 볼 수 있습니다. 이때: "File"->"open 9-path"를 누르면 NinePatch 그림을 만드는 데 사용된 원래 그림을 열 수 있습니다.캔버스의 위쪽과 왼쪽 모서리에 선을 그어 줌 영역을 지정하고 [Show patches]를 선택하면 지정된 영역이 표시됩니다. 녹색은 고정 크기 영역이고 빨간색은 줌 영역이며 문자는 빨간색 영역에 배치됩니다.제작이 끝난 후 "File"[save 9-path]를 클릭하여 그림을 저장하면draw9patch 도구는 자동으로 그림에 *.9를 추가합니다.png 접미사.
2.3 Layer List 레이어 목록 그래픽:
그림 모음으로 그림을 합성할 수 있습니다. 다음은 문서에서 Layer List 층 목록 도형에 대한 설명입니다: file location:res/drawable/filename.xml, 이 파일을 찾으려면 자원 id를 사용해야 합니다.다음은 원본 코드입니다.
<?xml version="1.0" encoding="utf-8"?>

<layer-list

    xmlns:android="http://schemas.android.com/apk/res/android" >

    <item

        android:drawable="@[package:]drawable/drawable_resource"//      

         android:id="@[+][package:]id/resource_name"   //         id  



        //       :  ,  ,  ,        .

        android:top="dimension"

        android:right="dimension"

        android:bottom="dimension"

        android:left="dimension" />

</layer-list>

응용 프로그램: 한 액자에 미녀 사진이 있는데 전환 버튼을 누르면 액자에 있는 미녀 사진이 전환됩니다.
public class DrawableActivity extends Activity {

    private ImageView imageView;

    

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

       //2.  imageView  

        imageView = (ImageView) this.findViewById(R.id.imageView);

    }

    //1.            ,    

   public void changeImage(View v){ 

     //LayerDrawable layerDrawable = (LayerDrawable) imageView.getDrawable();

     //4. imageview   ,         ,         layerDrawable

     //7.          ,    ,    .       .        

     // drawable imageview   ,              ,           ,  ,          .

     LayerDrawable layerDrawable = (LayerDrawable)getResources().getDrawable(R.drawable.layerlist);

     Drawable drawable = getResources().getDrawable(R.drawable.icon);

     //6.        . getDrawable    ,        ,    drawable  .

     //      ,        ,           ,        .

     //5.               ,               

     //,     :          drawable  .(     .)

     layerDrawable.setDrawableByLayerId(R.id.userimage, drawable);

     //3.        ,       Drawable  .

     imageView.setImageDrawable(layerDrawable);

    }

}

/drawable/res/drawable/icon.png/drawable/res/drawable/user.png/drawable/res/drawable/layerlist.xml
<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

  <!--               :faceback, user

   -->

   <!--             

     android:top="68dp"

        android:right="18dp"

        android:bottom="22dp"

        android:left="18dp"

        android:id="@+id/userimage"

               ,            

          xml   ,        ,  :

        file:///G:/android/android-sdk-windows/docs/guide/topics/resources/drawable-resource.html#LayerList

        example:XML file saved at res/drawable/layers.xml: <?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>

      <bitmap android:src="@drawable/android_red"

        android:gravity="center" />

    </item>

    <item android:top="10dp" android:left="10dp">

      <bitmap android:src="@drawable/android_green"

        android:gravity="center" />

    </item>

    <item android:top="20dp" android:left="20dp">

      <bitmap android:src="@drawable/android_blue"

        android:gravity="center" />

    </item>

</layer-list>

    -->

    <item android:drawable="@drawable/faceback" />

    <item android:drawable="@drawable/user"

        android:top="68dp"

        android:right="18dp"

        android:bottom="22dp"

        android:left="18dp"

        android:id="@+id/userimage"

        />

         <!-- android:id="@+id/userimage"             id -->

</layer-list>

/drawable/res/layout/main.xml
  <?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    >

    <!--      imageView  ,        -->

<ImageView  

    android:layout_width="wrap_content" 

    android:layout_height="wrap_content" 

    android:src="@drawable/layerlist"

    android:id="@+id/imageView"

    />

<!--      ,            :-->

 <Button

   android:background="@drawable/rectangle"

  android:layout_width="fill_parent" 

    android:layout_height="wrap_content" 

    android:text="  "

    android:onClick="changeImage"

 />

</LinearLayout>

참고: 레이어 리스트 그래픽은 여러 장의 사진을 한 장의 사진으로 합성하려는 경우 레이어 리스트 그래픽2.4 State List 상태 리스트 그래픽을 사용하여 개발할 수 있습니다.
우리가 어떤 단추를 누르거나 컨트롤을 눌렀을 때, 컨트롤의 상태에 따라 다른 도형을 표시할 수 있는 그림을 전환합니다.단추가 나타날 때 한 장의 사진을 표시하고, 단추가 눌릴 때 다른 사진 파일의 위치를 표시합니다:res/drawable/filename.xml 구문:
<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android"

   //      ,                

    android:constantSize=["true" | "false"]

    android:dither=["true" | "false"]

    android:variablePadding=["true" | "false"] >

    <item

    //          ,      

        android:drawable="@[package:]drawable/drawable_resource"

        //            

 android:state_pressed=["true" | "false"]]

 //true:           ,      

 //false:             ,      

        android:state_focused=["true" | "false"]

        //true:              ,      

 //false:               ,      

        android:state_hovered=["true" | "false"]

 //      ,        .

        android:state_selected=["true" | "false"]

 //true:             ,      

 //false:              ,      

 //           ,   ,     ,            

        android:state_checkable=["true" | "false"]

 //true:               ,      

 //false:                ,      

        android:state_checked=["true" | "false"]

 //true:             ,      

 //false:              ,      

        android:state_enabled=["true" | "false"]

 //true:             ,      

 //false:             ,      

        android:state_window_focused=["true" | "false"] />

 //true:               ,      

 //false:                ,      

 //             .

</selector>

 
2.5 Level List 레벨 목록 그래픽: 유형 그래픽을 사용하여 전환 가능한 이미지 세트를 관리할 수 있습니다.setLevel 방법을 사용하면 그림 전환을 할 수 있으며 안드로이드는 level의 값에 따라 대응하는 그림을 자동으로 선택합니다.휴대전화에 남은 전력량을 표시하는 것은 Level List 도형으로 서로 다른 그림을 표시하는 것이다.파일 위치:res/drawable/filename.xml 구문
<?xml version="1.0" encoding="utf-8"?>

<level-list

    xmlns:android="http://schemas.android.com/apk/res/android" >

    <item

        //     

      android:drawable="@drawable/drawable_resource"

        //         , 

      android:maxLevel="integer"

     android:minLevel="integer" />

</level-list>

2.6 Transition Drawable 프로세스 그래프:
한 장의 그림에서 다른 그림 파일의 위치로 넘어가는 것입니다:res/drawable/filename.xml
<xml version="1.0" encoding="utf-8"?>

<transition

xmlns:android="http://schemas.android.com/apk/res/android" >

    <item

        android:drawable="@[package:]drawable/drawable_resource"

        android:id="@[+][package:]id/resource_name"

        android:top="dimension"

        android:right="dimension"

        android:bottom="dimension"

        android:left="dimension" />

</transition>

2.7 Clip Drawable 그래픽 잘라내기:
Clip Drawable 유형 그래픽(자르기 그래픽) 파일 위치:res/drawable/filename.xml
<?xml version="1.0" encoding="utf-8"?>

<clip

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:drawable="@drawable/drawable_resource"

    android:clipOrientation=["horizontal" | "vertical"]

    android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" |

                     "fill_vertical" | "center_horizontal" | "fill_horizontal" |

                     "center" | "fill" | "clip_vertical" | "clip_horizontal"] />

2.8 Scale Drawable 배율 조정:file:///G:/android/android-sdk-windows/docs/guide/topics/resources/drawable-resource.html#StateList2.9 Shape Drawable 형태 그래픽:
  file location: res/drawable/filename.xml The filename is used as the resource ID. b.resource reference: In Java: R.drawable.name In XML: @[package:] drawable/filename android:shape=["rectangle"| "oval"| "line"| "ring"] > 직사각형, 타원형, 선형, 고리형.
<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape=["rectangle" | "oval" | "line" | "ring"] >

    //        

    <corners

    //        ,           .

        android:radius="integer"

 //             ,                

        android:topLeftRadius="integer"

        android:topRightRadius="integer"

        android:bottomLeftRadius="integer"

        android:bottomRightRadius="integer" 

 //     ,            ,               ,    

 //          .

 />

    <gradient

    //     ,         ,               ,

    //                    ,       .

        android:angle="integer"

 //     .       ,             ,

 //        180 ...     ..  .

        android:centerX="integer"//            

        android:centerY="integer"////            

        android:centerColor="integer"//            .

 //          

        android:endColor="color"//        

        android:gradientRadius="integer"//          ,         

        android:startColor="color"//        

        android:type=["linear" | "radial" | "sweep"]//        ,  ,

 //     ,       ...          ,        

        android:usesLevel=["true" | "false"] />//      ,          

    <padding//     ,         ,     ,              .

        android:left="integer"

        android:top="integer"

        android:right="integer"

        android:bottom="integer" />

    <size//  ,    

        android:width="integer"//        .

        android:height="integer"

  android:dashWidth="integer"//         ,    

        android:dashGap="integer"//       .

 />

    <solid//     ,               .

        android:color="color" />

    <stroke//   size   

        android:width="integer"

        android:color="color"

        android:dashWidth="integer"

        android:dashGap="integer" />

</shape>

3. 백그라운드 코드:
상기 도형을 포함하는 백그라운드 실현.
 
public class DrawableActivity extends Activity {

    private ImageView imageView;

    

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

       //2.  imageView  

        imageView = (ImageView) this.findViewById(R.id.imageView);

    }

    //1.            ,    

   public void changeImage(View v){

     //       ,     .

     ClipDrawable clipDrawable = (ClipDrawable) imageView.getDrawable();

     //      .

    clipDrawable.setLevel(clipDrawable.getLevel()+1000);

     //    ,      0,      ,     0   ,     ,   

    //  10000       .    .

     

     //     ,  v     ,    (Button)v     v   button  

    //    button   .getBackground(),  ,(TransitionDrawable)

    //    button Background         .

    //    ,      500  .

    TransitionDrawable transitionDrawable = (TransitionDrawable) ((Button)v).getBackground();

     transitionDrawable.startTransition(500);

     

    

     /*                 ,      12,           

      *       ,         

      * LevelListDrawable levelListDrawable = (LevelListDrawable) imageView.getDrawable();

     levelListDrawable.setLevel(12);*/

     

    

     /*                 

      * 

      * //LayerDrawable layerDrawable = (LayerDrawable) imageView.getDrawable();

     //4. imageview   ,         ,         layerDrawable

     //7.          ,    ,    .       .        

     // drawable imageview   ,              ,           

     //  ,          .

     LayerDrawable layerDrawable = (LayerDrawable)getResources().getDrawable(R.drawable.layerlist);

     Drawable drawable = getResources().getDrawable(R.drawable.icon);

     //6.        . getDrawable    ,        ,    drawable  .

     //      ,        ,           ,        .

     //5.               ,               

     //,     :          drawable  .(     .)

     layerDrawable.setDrawableByLayerId(R.id.userimage, drawable);

     //3.        ,       Drawable  .

     imageView.setImageDrawable(layerDrawable);

     */

    }

}

/drawable/res/drawable/bg_normal.9.png/drawable/res/drawable/bg_selected.9.png/drawable/res/drawable/clip.xml
 <?xml version="1.0" encoding="utf-8"?>

<clip xmlns:android="http://schemas.android.com/apk/res/android"

    android:drawable="@drawable/user"

    android:clipOrientation="horizontal"

    android:gravity="left" />

<!-- 

 android:drawable="@drawable/user"           ,

 android:clipOrientation="horizontal"     ,      

 android:gravity="left"            -->

/drawable/res/drawable/faceback.png/drawable/res/drawable/icon.png/drawable/res/drawable/layerlist.xml
<?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

  <!--               :faceback, user

   -->

   <!--             

     android:top="68dp"

        android:right="18dp"

        android:bottom="22dp"

        android:left="18dp"

        android:id="@+id/userimage"

               ,            

          xml   ,        ,  :

        file:///G:/android/android-sdk-windows/docs/guide/topics/resources/drawable-resource.html#LayerList

        example:XML file saved at res/drawable/layers.xml: <?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>

      <bitmap android:src="@drawable/android_red"

        android:gravity="center" />

    </item>

    <item android:top="10dp" android:left="10dp">

      <bitmap android:src="@drawable/android_green"

        android:gravity="center" />

    </item>

    <item android:top="20dp" android:left="20dp">

      <bitmap android:src="@drawable/android_blue"

        android:gravity="center" />

    </item>

</layer-list>

    -->

    <item android:drawable="@drawable/faceback" />

    

    <item android:drawable="@drawable/user"

        android:top="68dp"

        android:right="18dp"

        android:bottom="22dp"

        android:left="18dp"

        android:id="@+id/userimage"

        />

         <!-- android:id="@+id/userimage"             id 

         -->

        

</layer-list>

drawable/res/drawable/levellist.xml
<?xml version="1.0" encoding="utf-8"?>

<level-list xmlns:android="http://schemas.android.com/apk/res/android" >

<!--           0 10           -->

    <item android:drawable="@drawable/faceback" android:minLevel="0" android:maxLevel="10" />

    <item android:drawable="@drawable/user" android:minLevel="11" android:maxLevel="20"/>

</level-list>

drawable/res/drawable/rectangle.xml
  <?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

   <!-- //   ,    270  -->

    <gradient

        android:startColor="#FFFF0000"

        android:endColor="#80FF00FF"

        android:angle="270"/>

    <!-- //    -->

    <padding android:left="7dp"

        android:top="7dp"

        android:right="7dp"

        android:bottom="7dp" />

    <!-- //      -->

    <corners android:radius="8dp" />

   <!-- //   ,  2   ,  :#FFFFFF,      8   ,  ,          

   // 2    -->

    <stroke

        android:width="2dp"

        android:color="#FFFFFF"

        android:dashWidth="8dp"

        android:dashGap="4dp" />

</shape>

/drawable/res/drawable/statelist.xml
<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

   <!--                   .      ,     

       ,                 

    -->

    <item android:state_pressed="true" android:state_enabled="true" android:drawable="@drawable/bg_selected" /> <!-- pressed -->

 <!--  //true:           ,      

 //false:             ,       -->

    <item android:state_selected="true" android:drawable="@drawable/bg_selected" /> <!-- focused -->

   <!--  //true:             ,      

 //false:              ,       -->

    <item android:drawable="@drawable/bg_normal" /> <!-- default -->

    <!--            ,          ,             ,     

         ,         -->

</selector>

drawable/res/drawable/transition.xml
  <?xml version="1.0" encoding="utf-8"?>

<transition xmlns:android="http://schemas.android.com/apk/res/android">

   <!--             ,            ,                  -->

    <item android:drawable="@drawable/bg_normal" />

    <item android:drawable="@drawable/bg_selected" />

</transition>

/drawable/res/drawable/user.pngdrawable/res/layout/main.xml
<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    >

    <!--      imageView  ,        

    android:src="@drawable/layerlist"

      imageview     ,      .

      android:src="@drawable/levellist"

          ,     .

    -->

 

<ImageView  

    android:layout_width="wrap_content" 

    android:layout_height="wrap_content" 

    android:src="@drawable/clip"

    android:id="@+id/imageView"

    />

<!--      ,            :-->

 <!-- android:background="@drawable/statelist" 

      ,      

android:background="@drawable/transition"

              

 android:background="@drawable/rectangle"

 

 -->

 <Button

   android:background="@drawable/rectangle"

  android:layout_width="fill_parent" 

    android:layout_height="wrap_content" 

    android:text="  "

    android:onClick="changeImage"

 />

</LinearLayout>

좋은 웹페이지 즐겨찾기