`
wen742538485
  • 浏览: 237471 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Android简单的圆盘形菜单

阅读更多
今天偶然看到一个圆盘形的菜单,还可以转动,感觉挺有意思,然后想了想,做了个简单的效果。
      思路是这样的,定一个原点和一个半径,圆的四周均匀分布每个菜单。为了方便计算,菜单的坐标用度数表示,然后转化为极坐标计算。
      定某个点为起始点,根据总菜单数确定每个点增加的度数,然后依次确定每个点的度数,也就确定了坐标。
Java代码 

package chroya.demo.roundspin; 
 
import android.content.Context; 
import android.graphics.Bitmap; 
import android.graphics.BitmapFactory; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.util.Log; 
import android.view.MotionEvent; 
import android.view.View; 
 
/**
* 圆盘式的view
* @author chroya
*
*/ 
public class RoundSpinView extends View { 
    private Paint mPaint = new Paint(); 
     
    //stone列表 
    private BigStone[] mStones; 
    //数目 
    private static final int STONE_COUNT = 6; 
     
    //圆心坐标 
    private int mPointX=0, mPointY=0; 
    //半径 
    private int mRadius = 0; 
    //每两个点间隔的角度 
    private int mDegreeDelta; 
 
    public RoundSpinView(Context context, int px, int py, int radius) { 
        super(context); 
        mPaint.setColor(Color.RED); 
        mPaint.setStrokeWidth(2); 
        setBackgroundResource(R.drawable.menubkground); 
         
        mPointX = px; 
        mPointY = py; 
        mRadius = radius; 
         
        setupStones(); 
        computeCoordinates(); 
    } 
     
    /**
     * 初始化每个点
     */ 
    private void setupStones() { 
        mStones = new BigStone[STONE_COUNT]; 
        BigStone stone; 
        int angle = 0; 
        mDegreeDelta = 360/STONE_COUNT; 
         
        for(int index=0; index<STONE_COUNT; index++) { 
            stone = new BigStone(); 
            stone.angle = angle; 
            stone.bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.menu1+index);             
            angle += mDegreeDelta; 
             
            mStones[index] = stone; 
        } 
    } 
     
    /**
     * 重新计算每个点的角度
     */ 
    private void resetStonesAngle(float x, float y) { 
        int angle = computeCurrentAngle(x, y); 
        Log.d("RoundSpinView", "angle:"+angle); 
        for(int index=0; index<STONE_COUNT; index++) {            
            mStones[index].angle = angle;        
            angle += mDegreeDelta; 
        } 
    } 
     
    /**
     * 计算每个点的坐标
     */ 
    private void computeCoordinates() { 
        BigStone stone; 
        for(int index=0; index<STONE_COUNT; index++) { 
            stone = mStones[index]; 
            stone.x = mPointX+ (float)(mRadius * Math.cos(stone.angle*Math.PI/180)); 
            stone.y = mPointY+ (float)(mRadius * Math.sin(stone.angle*Math.PI/180)); 
        } 
    } 
     
    /**
     * 计算第一个点的角度
     * @param x
     * @param y
     * @return
     */ 
    private int computeCurrentAngle(float x, float y) {      
        float distance = (float)Math.sqrt(((x-mPointX)*(x-mPointX) + (y-mPointY)*(y-mPointY))); 
        int degree = (int)(Math.acos((x-mPointX)/distance)*180/Math.PI); 
        if(y < mPointY) { 
            degree = -degree; 
        } 
         
        Log.d("RoundSpinView", "x:"+x+",y:"+y+",degree:"+degree); 
        return degree; 
    } 
     
    @Override 
    public boolean dispatchTouchEvent(MotionEvent event) { 
        resetStonesAngle(event.getX(), event.getY()); 
        computeCoordinates(); 
        invalidate(); 
        return true; 
    } 
     
    @Override 
    public void onDraw(Canvas canvas) { 
        canvas.drawPoint(mPointX, mPointY, mPaint); 
         
        for(int index=0; index<STONE_COUNT; index++) { 
            if(!mStones[index].isVisible) continue; 
            drawInCenter(canvas, mStones[index].bitmap, mStones[index].x, mStones[index].y); 
            //不想有红线,就注掉下面这句 
//          canvas.drawLine(mPointX, mPointY, mStones[index].x, mStones[index].y, mPaint); 
        } 
    } 
     
    /**
     * 把中心点放到中心处
     * @param canvas
     * @param bitmap
     * @param left
     * @param top
     */ 
    void drawInCenter(Canvas canvas, Bitmap bitmap, float left, float top) { 
        canvas.drawPoint(left, top, mPaint); 
        canvas.drawBitmap(bitmap, left-bitmap.getWidth()/2, top-bitmap.getHeight()/2, null); 
    }    
     
    class BigStone { 
         
        //图片 
        Bitmap bitmap; 
         
        //角度 
        int angle; 
         
        //x坐标 
        float x; 
         
        //y坐标 
        float y; 
         
        //是否可见 
        boolean isVisible = true; 
    } 


       代码里注释也很清楚。STONE_COUNT表示菜单的数目,可以设置为1到7,更大的数字需要图片支持,我只放了7张图片。
       如果触摸的点不在圆周上,会自动计算出点到圆心的直线跟圆的交点,然后映射上去。
   5个菜单的效果,画了线的:


   
  • 大小: 82.9 KB
分享到:
评论

相关推荐

    Android仿酷点圆形菜单

    开发者可能使用了`Canvas`和`Paint`对象来绘制圆盘,并为每个菜单项设定特定的角度和半径。在Android中,可以利用`Path`对象来绘制复杂的形状,包括圆形和弧线,然后用`canvas.drawPath()`进行渲染。 3. 动画效果:...

    Android圆盘旋转菜单实例.rar

    【Android圆盘旋转菜单实例】是一个专为移动设备设计的创新UI组件,它提供了一种独特的方式来展示菜单选项。这个菜单的设计灵感来源于淘宝客户端的圆形菜单,用户可以通过手势或者点击触发菜单的旋转动画,从而优雅...

    圆盘旋转菜单的实现

    圆盘旋转菜单是一种独特且富有视觉效果的交互设计,它通常用于移动应用或者网页中,为用户提供一种新颖的导航方式。这种菜单以圆形布局呈现,用户点击或触摸中心点后,菜单项会像圆盘旋转一样展开,既美观又实用。 ...

    Android-CircleMenu是一个简单优雅拥有圆形布局的菜单

    Android-CircleMenu库正是这样一款工具,它提供了一个简单、优雅且具有圆形布局的菜单,使得开发者能够轻松地在应用程序中创建引人注目的交互元素。本文将深入探讨这一库的核心特点、使用方法以及其实现原理。 首先...

    android实现从底部滑出的半圆形菜单

    本教程将详细解析如何在Android平台上实现一个从底部滑出的半圆形菜单。这个菜单不仅能够提供一种新颖的用户体验,还可以帮助优化屏幕空间利用,使应用更具现代感。 首先,我们需要了解Android布局系统。在Android...

    一个简单的圆形菜单控件.zip

    【标题】:一个简单的圆形菜单控件...综上所述,"一个简单的圆形菜单控件"是一个实用的Android开发工具,通过学习和使用这个开源项目,开发者不仅可以提升自己的UI设计能力,还能深入理解Android自定义View的开发流程。

    Android应用源码之圆盘菜单.zip

    "Android应用源码之圆盘菜单.zip"这个压缩包显然包含了实现这种圆盘菜单功能的源代码,对于开发者来说,它是一个宝贵的资源,可以用来学习和借鉴。 首先,我们要理解"源码"的重要性。在编程世界中,源码是程序的...

    android自定义View(五)打造自己的遥控器菜单

    在Android开发中,自定义View是一项重要的技能,它允许开发者根据特定需求创建独特且功能丰富的用户界面。本篇文章将深入探讨如何打造一个圆形的遥控器菜单,为用户提供类似电视遥控器的操作体验。这个自定义View将...

    Android 圆盘菜单-IT计算机-毕业设计.zip

    【Android圆盘菜单】是一种独特的用户界面元素,常见于Android应用程序中,用于提供一种交互式的操作方式。在毕业设计或论文中,这种创新的UI设计可能会成为亮点,吸引用户的注意力并提升用户体验。圆盘菜单的设计...

    圆形旋转的android菜单源代码

    在Android开发中,创建独特且吸引用户的交互式菜单是一项挑战,而“圆形旋转的android菜单源代码”就是针对这一需求的解决方案。这个源代码提供了一种创新的方式,通过圆形旋转的效果来展示菜单项,给用户带来新颖的...

    Android 圆形旋转菜单.zip

    圆形旋转菜单是一种特殊的导航模式,用户点击中心按钮后,菜单会像一个圆盘一样从中心点向外旋转展开,呈现出多个可选的选项。这种设计通常用于设置、功能选择或者主菜单等场景,因其动画效果和交互体验,能有效吸引...

    圆盘菜单.zip

    在Android开发领域,"圆盘菜单"是一种独特的交互设计,它为用户提供了一种直观且吸引人的选择和操作方式。这个"圆盘菜单.zip"压缩包很可能是包含了一个实现这种菜单效果的Android源码示例。下面我们将深入探讨圆盘...

    Android展示圆形转盘的代码例子

    在Android开发中,创建一个圆形转盘的界面可以增加应用的互动性和趣味性,常见于游戏、抽奖或者个性化菜单的设计中。本示例代码着重于实现一个可触摸旋转的圆形转盘,通常会涉及到以下几个核心知识点: 1. **自定义...

    Android学习教程之圆形Menu菜单制作方法(1)

    此外,还可以使用第三方库如`CircleMenu`或`RoundMenu`来快速实现圆形菜单功能,这些库已经封装好了菜单的布局和动画逻辑,只需简单集成即可使用。在Android Studio中,可以通过添加依赖到`build.gradle`文件来引入...

    安卓圆盘菜单效果

    "安卓圆盘菜单效果"是一个专为提升应用交互性设计的特效,它将传统的菜单以圆盘的形式展示,既美观又实用。这种设计模式通常用于导航或者在有限的空间内展示多个选项,例如在移动设备的小屏幕上。 首先,让我们深入...

    安卓源码圆盘菜单.zip

    在深入探讨Android源码圆盘菜单这个主题之前,我们首先要明确几个关键概念。"安卓源码"通常指的是Android操作系统的原始代码,它为开发者提供了系统级别的理解和定制能力。"圆盘菜单"则是一种常见的用户界面设计,其...

    android 圆盘效果

    在Android应用开发中,"圆盘效果"是一种独特的视觉设计,通常用于创建吸引用户的交互界面。这个项目中的"名片项目"很可能使用了圆盘布局来展示信息,使其看起来既新颖又具有吸引力。圆盘效果可以是旋转菜单、圆形...

Global site tag (gtag.js) - Google Analytics