源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Android编程实现仿优酷旋转菜单效果(附demo源码)

  • 时间:2022-04-11 15:01 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Android编程实现仿优酷旋转菜单效果(附demo源码)
本文实例讲述了Android编程实现仿优酷旋转菜单效果。分享给大家供大家参考,具体如下: 首先,看下效果: [img]http://files.jb51.net/file_images/article/201512/20151212131503049.jpg?20151112131515[/img] [img]http://files.jb51.net/file_images/article/201512/20151212131519166.jpg?20151112131542[/img] 不好意思,不会制作动态图片,只好上传静态的了,如果谁会,请教教我吧。 首先,看下xml文件:
<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  android:layout_width="fill_parent" 
  android:layout_height="fill_parent" 
  android:background="#c9c9c9" > 
  <RelativeLayout 
    android:id="@+id/relate_level3" 
    android:layout_width="280dp" 
    android:layout_height="140dp" 
    android:layout_alignParentBottom="true" 
    android:layout_centerHorizontal="true" 
    android:background="@drawable/level3" > 
    <ImageButton 
     android:id="@+id/c1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_marginBottom="6dip" 
     android:layout_marginLeft="12dip" 
     android:background="@drawable/channel1" /> 
    <ImageButton 
     android:id="@+id/c2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/c1" 
     android:layout_marginBottom="12dip" 
     android:layout_marginLeft="28dip" 
     android:background="@drawable/channel2" /> 
    <ImageButton 
     android:id="@+id/c3" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/c2" 
     android:layout_marginBottom="8dip" 
     android:layout_marginLeft="6dip" 
     android:layout_toRightOf="@+id/c2" 
     android:background="@drawable/channel3" /> 
    <ImageButton 
     android:id="@+id/c4" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_margin="6dip" 
     android:background="@drawable/channel4" /> 
    <ImageButton 
     android:id="@+id/c5" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/c6" 
     android:layout_marginBottom="8dip" 
     android:layout_marginRight="6dip" 
     android:layout_toLeftOf="@+id/c6" 
     android:background="@drawable/channel5" /> 
    <ImageButton 
     android:id="@+id/c6" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_above="@+id/c7" 
     android:layout_alignParentRight="true" 
     android:layout_marginBottom="12dip" 
     android:layout_marginRight="28dip" 
     android:background="@drawable/channel6" /> 
    <ImageButton 
     android:id="@+id/c7" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:layout_marginBottom="6dip" 
     android:layout_marginRight="12dip" 
     android:background="@drawable/channel7" /> 
  </RelativeLayout> 
  <RelativeLayout 
    android:id="@+id/relate_level2" 
    android:layout_width="180dp" 
    android:layout_height="90dp" 
    android:layout_alignParentBottom="true" 
    android:layout_centerHorizontal="true" 
    android:background="@drawable/level2" > 
    <ImageButton 
     android:id="@+id/menu" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_margin="6dip" 
     android:background="@drawable/icon_menu" /> 
    <ImageButton 
     android:id="@+id/search" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_margin="10dip" 
     android:background="@drawable/icon_search" /> 
    <ImageButton 
     android:id="@+id/myyouku" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:layout_margin="10dip" 
     android:background="@drawable/icon_myyouku" /> 
  </RelativeLayout> 
  <RelativeLayout 
    android:id="@+id/relate_level1" 
    android:layout_width="100dp" 
    android:layout_height="50dp" 
    android:layout_alignParentBottom="true" 
    android:layout_centerHorizontal="true" 
    android:background="@drawable/level1" > 
    <ImageButton 
     android:id="@+id/home" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="10dp" 
     android:background="@drawable/icon_home" /> 
  </RelativeLayout> 
</RelativeLayout>

大家看到主要有三个RalativeLayout,就是大家看到的三层,但是关于图片的倾斜 是怎样实现的呢?实际上是个假象,图片是正放的,里面图像是倾斜的。如下图: [img]http://files.jb51.net/file_images/article/201512/20151212131558923.png?20151112131610[/img] 这样大概能明白,下面就是开始动画效果了,先看下主Activity:
public class TestYoukuActivity extends Activity { 
  /** Called when the activity is first created. */ 
  private boolean areLevel2Showing = true, areLevel3Showing = true; 
  private RelativeLayout relate_level2, relate_level3; 
  private ImageButton home, menu; 
  @Override 
  public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.main); 
    findViews(); 
    setListener();  
  } 
  private void findViews() { 
    relate_level2 = (RelativeLayout) findViewById(R.id.relate_level2); 
    relate_level3 = (RelativeLayout) findViewById(R.id.relate_level3); 
    home = (ImageButton) findViewById(R.id.home); 
    menu = (ImageButton) findViewById(R.id.menu); 
  } 
  private void setListener() { 
    // 给大按钮设置点击事件 
    home.setOnClickListener(new OnClickListener() { 
     @Override 
     public void onClick(View v) { 
       if (!areLevel2Showing) { 
        MyAnimation.startAnimationsIn(relate_level2, 500); 
       } else { 
        if (areLevel3Showing) { 
          MyAnimation.startAnimationsOut(relate_level2, 500, 500); 
          MyAnimation.startAnimationsOut(relate_level3, 500, 0); 
          areLevel3Showing = !areLevel3Showing; 
        } else { 
          MyAnimation.startAnimationsOut(relate_level2, 500, 0); 
        } 
       } 
       areLevel2Showing = !areLevel2Showing; 
     } 
    }); 
    menu.setOnClickListener(new OnClickListener() { 
     @Override 
     public void onClick(View v) { 
       if (!areLevel3Showing) { 
        MyAnimation.startAnimationsIn(relate_level3, 500); 
       } else { 
        MyAnimation.startAnimationsOut(relate_level3, 500, 0); 
       } 
       areLevel3Showing = !areLevel3Showing; 
     } 
    }); 
  } 
}

应该注意到了:
[url=http://xiazai.jb51.net/201512/yuanma/Android-Test-Youku-style-codes(jb51.net).rar]本站下载[/url]。 希望本文所述对大家Android程序设计有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部