近在做一个钢琴的东西,关于这个界面如何设计画了很长时间,主要是考虑到针对不同的分辨率,如果只针对一种分辨率的话用绝对布局可以实现,实现的基本思想是每个白色的键的位置是可以计算出来的,屏幕的宽度可以获得到,白键是将屏幕均匀的分成8份,所以每个白键所处的位置是可以得到的,而由于黑键的实现采用的是重写ViewGroup的方法,先计算出每个黑键的位置,然后再执行onLayout方法将黑键放在指定的位置。

布局如下:

[html]

android:id="@+id/mClickLayout"

android:layout_width="fill_parent"

android:layout_height="fill_parent">

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="horizontal">

android:id="@+id/mPanoClickWhiteOne"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="1"

/>

android:id="@+id/mPanoClickWhiteTwo"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="2"

/>

android:id="@+id/mPanoClickWhiteThree"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="3"

/>

android:id="@+id/mPanoClickWhiteFour"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="4"

/>

android:id="@+id/mPanoClickWhiteFive"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="5"

/>

android:id="@+id/mPanoClickWhiteSix"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="6"

/>

android:id="@+id/mPanoClickWhiteSeven"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="7"

/>

android:id="@+id/mPanoClickWhiteEight"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="8"

/>

android:layout_width="fill_parent"

android:layout_height="wrap_content">

android:id="@+id/mPanoClickBlackOne"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="9"

/>

android:id="@+id/mPanoClickBlackTwo"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="10"

/>

android:id="@+id/mPanoClickBlackThree"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="11"

/>

android:id="@+id/mPanoClickBlackFour"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="12"

/>

android:id="@+id/mPanoClickBlackFive"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="13"

/>

android:id="@+id/mClickLayout"

android:layout_width="fill_parent"

android:layout_height="fill_parent">

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:orientation="horizontal">

android:id="@+id/mPanoClickWhiteOne"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="1"

/>

android:id="@+id/mPanoClickWhiteTwo"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="2"

/>

android:id="@+id/mPanoClickWhiteThree"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="3"

/>

android:id="@+id/mPanoClickWhiteFour"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="4"

/>

android:id="@+id/mPanoClickWhiteFive"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="5"

/>

android:id="@+id/mPanoClickWhiteSix"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="6"

/>

android:id="@+id/mPanoClickWhiteSeven"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="7"

/>

android:id="@+id/mPanoClickWhiteEight"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:layout_weight="1000"

android:tag="8"

/>

android:layout_width="fill_parent"

android:layout_height="wrap_content">

android:id="@+id/mPanoClickBlackOne"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="9"

/>

android:id="@+id/mPanoClickBlackTwo"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="10"

/>

android:id="@+id/mPanoClickBlackThree"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="11"

/>

android:id="@+id/mPanoClickBlackFour"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="12"

/>

android:id="@+id/mPanoClickBlackFive"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:tag="13"

/>

LinearLayout内的控件为白键,一共有8个白键,每个白键的权值是1000,所以每个白键的位置是可以计算出来的,com.example.crazypanp.view.BlackLayout是重写的ViewGroup.主要用来排放黑键。

代码如下:

[java]

public class BlackLayout extends ViewGroup {

private List mLeftPositions;

public BlackLayout(Context context, AttributeSet attrs) {

super(context, attrs);

mLeftPositions = new ArrayList();

}

private void addPosition(int pScreenWidth, int pChildWidth){

int pScreenUnit = pScreenWidth / 8;

mLeftPositions.clear();

mLeftPositions.add(pScreenUnit - 2 * pChildWidth / 3);

mLeftPositions.add(2 * pScreenUnit - pChildWidth / 3);

mLeftPositions.add(4 * pScreenUnit - 2 * pChildWidth / 3);

mLeftPositions.add(5 * pScreenUnit - pChildWidth / 2);

mLeftPositions.add(6 * pScreenUnit - pChildWidth / 3);

}

@Override

protected void onLayout(boolean arg0, int l, int t, int r, int b) {

// TODO Auto-generated method stub

int childCount = this.getChildCount();

int gap = 0;

int space=0;

if(this.getChildCount() >= 1){

addPosition(this.getWidth(), this.getChildAt(0).getWidth());

}

for( int i = 0; i < this.getChildCount(); i++){

View child = this.getChildAt(i);

child.measure(r - l, b - t);

}

for (int i = 0; i < childCount; i++) {

View child = this.getChildAt(i);

child.setVisibility(View.VISIBLE);

child.measure(r - l, b - t);

int childWidth = child.getMeasuredWidth();

int childHeight = child.getMeasuredHeight();

child.layout(mLeftPositions.get(i), t, mLeftPositions.get(i) + childWidth, t + childHeight);

}

}

}

public class BlackLayout extends ViewGroup {

private List mLeftPositions;

public BlackLayout(Context context, AttributeSet attrs) {

super(context, attrs);

mLeftPositions = new ArrayList();

}

private void addPosition(int pScreenWidth, int pChildWidth){

int pScreenUnit = pScreenWidth / 8;

mLeftPositions.clear();

mLeftPositions.add(pScreenUnit - 2 * pChildWidth / 3);

mLeftPositions.add(2 * pScreenUnit - pChildWidth / 3);

mLeftPositions.add(4 * pScreenUnit - 2 * pChildWidth / 3);

mLeftPositions.add(5 * pScreenUnit - pChildWidth / 2);

mLeftPositions.add(6 * pScreenUnit - pChildWidth / 3);

}

@Override

protected void onLayout(boolean arg0, int l, int t, int r, int b) {

// TODO Auto-generated method stub

int childCount = this.getChildCount();

int gap = 0;

int space=0;

if(this.getChildCount() >= 1){

addPosition(this.getWidth(), this.getChildAt(0).getWidth());

}

for( int i = 0; i < this.getChildCount(); i++){

View child = this.getChildAt(i);

child.measure(r - l, b - t);

}

for (int i = 0; i < childCount; i++) {

View child = this.getChildAt(i);

child.setVisibility(View.VISIBLE);

child.measure(r - l, b - t);

int childWidth = child.getMeasuredWidth();

int childHeight = child.getMeasuredHeight();

child.layout(mLeftPositions.get(i), t, mLeftPositions.get(i) + childWidth, t + childHeight);

}

}

}

在onLayout函数中首先确定每个黑键的位置,然后再通过onLayout函数进行位置的摆放。

Android钢琴滑动代码,android 钢琴界面实现相关推荐

  1. Android钢琴滑动代码,Android实现简易版弹钢琴效果

    本文实例为大家分享了Android实现弹钢琴效果展示的具体代码,供大家参考,具体内容如下 目标效果: 1.drawable下新建button_selector.xml页面: 2.drawable下新建 ...

  2. android小球移动代码,Android自定义圆形View实现小球跟随手指移动效果

    本文实例为大家分享了Android实现小球跟随手指移动效果的具体代码,供大家参考,具体内容如下 一. 需求功能 手指在屏幕上滑动,红色的小球始终跟随手指移动. 实现的思路: 1)自定义View,在on ...

  3. android gridview滑动卡,Android RecyclerView的卡顿问题

    本文其实是上一篇Android本地app操作相关基础的延伸,然而内容基本没什么联系了(初学者身份瞬间暴露,打一枪换一个地方←_←),就不好意思再添个"续"或者"(2)&q ...

  4. android手势滑动页面,Android 手势识别 (左右滑动)实现 页面 切换

    要实现 页面左右滑动的效果  就一定要由手势识别器, 就是这个对象 GestureDetector. 用法其实很简单,这里 写一下 方便以后用到的时候好找. 步骤就是 这样子 123.. 1. 初始化 ...

  5. android确认密码代码,Android手机卫士之确认密码对话框

    本文接着实现"确认密码"功能,也即是用户以前设置过密码,现在只需要输入确认密码 布局文件和<Android 手机卫士--设置密码对话框>中的布局基本类似,所有copy一 ...

  6. Android可滑动画板,Android 利用 Canvas 画画板

    首先新建一个项目工程,建立文件,如下图所示 首先配置页面布局文件activity_main.xml,如下图所示: xmlns:tools="http://schemas.android.co ...

  7. android 横向滑动 回弹,android ScrollView水平滑动回弹

    在研究了View的一些属性之后做了个Scroll的水平滑动回弹. 效果图: 主要代码: import android.content.Context; import android.graphics. ...

  8. android apk安装代码,Android安装APK

    7.0以上安装APK,请自行配置FileProvider,具体不多说 android:name="androidx.core.content.FileProvider" andro ...

  9. android增删功能代码,Android Studio开发实战 之 增删改查

    增删改查是一个应用最基础的操作,增删改查的流程走通了,下面的路程也就顺利多了.现在使用Android Studio开发一个简单的应用,该应用就实现了增删改查的操作,看似简单,到底简不简单呢,下面开始操 ...

最新文章

  1. linux python版本_linux下更新Python版本并修改默认版本
  2. Android 开发者必知的开发资源
  3. 7 orm 有批量更新_ORM之SQLAlchemy
  4. 皮一皮:所以说,快乐水才会让人变胖...
  5. sparksql dataframe变成csv保存_Spark大数据分析(三):DataFrame和SQL
  6. principle导出html5,让Principle成为生产力工具(二)单页面中的联动
  7. leetcode笔记:Search in Rotated Sorted Array
  8. Linux批量文件名大小写转换,Linux中批量把文件名大小写转换
  9. Unity打包APK多语言包名的适配
  10. 求圆周长、圆面积、圆球表面积、圆球体积、圆柱体积。用scanf输入数据,输出计算结果
  11. BUG记录:org.xml.sax.SAXParseException; lineNumber: 1; columnNumber: 1; Content is no
  12. 计算机基础键盘操作,电脑基础入门操作知识三:如何使用键盘盲打
  13. Nachos project1 领悟
  14. Java微信SDK方式进行网页授权
  15. 【复习必备】高中数学必修四公式汇总, 精华版赶快收藏
  16. 音频文件如何转成mp3格式
  17. 如何加快客户端更新脱机地址簿
  18. 第3章 直流电机的工作原理及特性 学习笔记(一)
  19. c 全国计算机二级考试真题及答案,全国计算机二级考试《C语言》真题练习及答案...
  20. freemarker 页面静态化技术

热门文章

  1. SAP Spartacus internationalization ( i18n ) 翻译问题的排错指南
  2. Angular 项目 ng serve 背后发生的事情
  3. 重新安装SCCM 2012 client,解决Windows10 1909在线更新问题
  4. SAP CRM呼叫中心polling and C4C notification polling
  5. 如何把SAP CRM产品主数据隐藏的batch ID字段显示出来
  6. JAM - how count is got - SAP Fiori和JAM的集成
  7. i18n - why Chinese resource will be loaded by default
  8. Leetcode上的解法看不懂?试着用动画的方式去辅助理解
  9. CRM WebClient UI错误消息的两种显示方式比较
  10. 一个最简单的用SAP UI5实现的live search demo,完整代码只有55行