• 网站刚刚上线,难免有不足的地方,敬请谅解!欢迎提出宝贵意见!

  •    3年前 (2015-06-14)  Android应用开发 安卓应用 |   抢沙发  211 
    文章评分 1 次,平均分 4.0

    前言:

    各位小伙伴,又到了每周更新文章了时候了,上一篇博客【Android 桌面开发系列】电视Metro桌面开发二说到Launcher主体框架用ViewPager来实现,这一篇博客咱们来说说每一个page的具体实现。

    PagerAdapter:

    Launcher主体ViewPager实现就引出了PagerAdapter,PagerAdapter是android.support.v4包中的类,它的子类有FragmentPagerAdapter, FragmentStatePagerAdapter,这两个adapter都是Fragment的适配器,这里因为没有用到Fragment所以这里不讲,我只讲PagerAdapter。关于PageAapter的描述,Google官网原文是这样的:Base class providing the adapter to populate pages inside of a ViewPager.  You will most likely want to use a more specific implementation of this, such as FragmentPagerAdapter or FragmentStatePagerAdapter,大致就是说PagerAdapter是ViewPager提供的一个适配器,方便我们对ViewPager的每一个View进行控制。我的PagerAdapter是这样实现的:

    PageViewItem:

    PagerAdapter的getCurrentView方法返回的每一个view都是自定义View,为什么要自定义呢?因为在每一个图标获取焦点放大的时候会与旁边的图标有重叠部分,ViewPager每一页view都是一个FrameLayout,在绘制view的时候是按照一定的顺序绘制的,就会遇到焦点view放大后显示的效果是被旁边的view压了一部分,如果不改变view绘制顺序就不能避免这个问题。

    【Android 桌面开发系列】电视Metro桌面开发三

    如上图所示,图一显示效果就是焦点view放大,改变绘制顺序的实现效果。改变绘制顺序其实就是重写ViewGroup的getChildDrawingOrder(int childCount, int i)方法,每一次绘制时,最后返回focusview所在的viewgroup中的index就行了。

    CellView:

    如上图所示,每一个正方形的view我在这里叫做CellView,它也是一个自定义的view,自定义主要是为了实现:

    1、获取焦点时放大和丢掉焦点时缩小效果,这里是应用了属性动画,ViewPropertyAnimator可以通过View的animate()方法获取的,具体动画实现如下:

    2、在xml文件灵活配置一些CellView的属性,比如点击打开的应用,呈现的ICON获取地址,焦点x、y的放大值等,CellView对应的属性定义attrs.xml文件如下:

     

    3、实现在用遥控器移动焦点时不会焦点错乱,在开发遥控器应用时一个很大的问题就是焦点在移动时焦点错乱,基本上应用UI bug至少有一半时焦点bug,这个应用我为了防止焦点错乱定义了CellView的边界属性,上面的xml文件中isXXEdge就是,这样在焦点移动到边界时可以进行Page之间的切换和其他处理,防止焦点在进入每一个page时出现错乱。

    下面来看一下实现的具体效果:

    【Android 桌面开发系列】电视Metro桌面开发三

    总结:

    以上就是Metro风格Launcher实现,我用了三篇博客来讲解这个应用,所有效果的实现都是自己摸索的,应该还有更好的实现方法,大家可以多多交流提出自己的看法,以上谢谢!

     

    想第一时间获得更多原创文章,请关注个人微信公众平台:程序员互动联盟(coder_online),扫一扫下方二维码或者搜索微信号coder_online即可关注,里面有大量Android,Chromium,Linux,编程技巧等相关文章等着您,我们还可以在线交流。

    【Android 桌面开发系列】电视Metro桌面开发三

     

    本文原始地址:http://www.coderonline.net/android-desktop-development-series-metro-tv-desktop-development.html

    本站所有文章,除特别注明外,均为本站原创,转载请注明出处来自http://www.coderonline.net/

    否则保留追究法律责任的权利!

    关于

    发表评论

    表情 格式

    暂无评论

       3年前 (2015-06-14)  专业技术 安卓应用 |   抢沙发  117 
    文章评分 0 次,平均分 0.0
    [收起] 文章目录

    前言:

    从毕业到现在已经三年多了,回忆一下这三年基本上没有写过博客,总是觉得忙,没时间写,也觉得写博客没什么大用。但是看到很多大牛们都在写博客,分享自己的东西,所以嘛本着向大牛看齐,分享第一,记录第二的目的开始写一个系列的文章,我会把我做一个项目的详细过程分享给大家,供大家参考和交流。好了,评书开讲!

    可能大家做Android机顶盒或者Android电视开发的比较少,这类开发基本上都是基于源码的开发,大家有一个git版本库,大家开发完了编译出来一个版本烧到板子上跑,要编译肯定就要编译环境什么的,google推荐的是在Ubuntu系统上搭建开发和编译环境。

    环境搭建:

    • 大家可以装双系统或者用Oracle VM VirtualBox在Windows上安装Ubuntu。安装双系统我这里就不说了,大家可以去网上查一下,这里有一个链接大家可以参考:点击打开链接
    • 在Windows环境下通过Oracle VM VirtualBox安装Ubuntu请参考:点击打开链接
      我这说一下注意事项:
      (1).必须是Windows7,如果是Windows8可能会出现意想不到的事情,总之就是不想遇到麻烦就用Windows7。
      (2).分配虚拟磁盘空间的时候至少要分配30G,因为你要下载android-sdk就会用上十几G,你要是再下载源码那你至少要分60G的空间。
      (3).安装完系统后一定要安装增强插件,否则窗口无法全屏,安装方法如下图:
      【Android 桌面开发系列】电视Metro桌面开发一
    • 点击红色箭头所指位置,然后在弹出框输入用户密码确认安装,安装完毕重启就可以全屏了。
    • 配置开发环境:
      (1).配置adb:
      去官网下载android-sdk-linux,下载地址是:http://dl.google.com/android/ + 不同版本的sdk
      例如:下载r20版本
      r20的linux版本:http://dl.google.com/android/android-sdk_r20-linux.tgz
      r20的windows版本:http://dl.google.com/android/android-sdk_r20-windows.zip
      r20的mac版本:http://dl.google.com/android/android-sdk_r20-macosx.zip
      把上面下载的sdk解压到一个目录,比如说是~/software/目录,
      终端执行:sudo gedit ~/.bashrc
      在最后添加如下内容:
      #set path for android sdk tools
      exportPATH=$PATH:/home/leo/software/android-sdk-linux/tools
      export PATH=$PATH:/home/wuhao/software/android-sdk-linux/platform-tools/
      (2).配置java环境:
      去官网:点击打开链接下载对应版本的jdk,我的是64位系统,所以下载:jdk-7u75-linux-x64.tar.gz,执行下面的命令:
      sudo mkdir  /usr/lib/jvm/
      cd /usr/lib/jvm/
      cp  ~/software/jdk-7u75-linux-x64.tar.gz   ./
      sudo tar -vxzf  jdk-7u75-linux-x64.tar.gz
      把环境变量配置在用户目录.bashrc文件中是最好的选择,sudo gedit ~/.bashrc,在bashrc里添加:
      #set java environment
      JAVA_HOME=/usr/lib/jvm/jdk1.7.0_75
      export JRE_HOME=/usr/lib/jvm/jdk1.7.0_75/jre
      export CLASSPATH=.:$JAVA_HOME/lib:$JRE_HOME/lib:$CLASSPATH
      export PATH=$JAVA_HOME/bin:$JRE_HOME/bin:$PATH
      重启生效或者source .bashrc生效
      (3).剩下的就是IDE下载和配置了,你可以选用Eclipse或者Android Studio。

    Launcher设计:

            在电视或者机顶盒上做UI开发,首先要考虑电视尺寸都比较大,你的UI展现要能够在电视屏幕上看着大小合适,展现的简洁舒服,别像原生Launcher那样好多小图标看着密密麻麻的,第二个是要方便遥控器操作,焦点导航显示正确,因为你不可能给机顶盒外接一个鼠标模仿触摸操作,那样太不方便。所以大家都会想到类似Windows 8的那种风格。设计大概像是下面的图:
    【Android 桌面开发系列】电视Metro桌面开发一
    产品要求:
    (1)在显示第一屏的时候第二屏要在屏幕右侧有一部分显示,并且是缩小显示,在page二显示的时候page一在左侧缩小显示一部分,page三部分显示,page之间切换流畅,图标放大缩小流畅。
    (2)在每一个图标上焦点的时候要放大显示,图标周围有阴影或者焦点框之类的突出显示出来,丢焦点的时候还原为正常显示。
    (3)图标对应的应用链接可以在xml文件配置。
    (4)page个数可以配置,可以通过简单的修改参数去掉某个page。
    拿到上面的产品需求你会怎么做呢?我是作如下考虑的:
    (1)第一个需求我想到了ViewPager、viewflipper,这两个可以做到page之间切换流畅。
    (2)每一个图标抽象出来做成一个View,放大缩小用属性动画可以做到,对应的View xml文件可以自定义属性完成应用链接配置。
    (3)灵活添加,删除page需要好好考虑一下代码实现。
          以上就是我Launcher Metro风格实现的第一篇博文,简单描述了环境配置和设计思路,写的有不足之处还请各位多多包涵和交流,具体代码实现我会在我的下一篇博文中进行讲解,请多多关注!

    想第一时间获得更多原创文章,请关注个人微信公众平台:程序员互动联盟(coder_online),扫一扫下方二维码或者搜索微信号coder_online即可关注,里面有大量Android,Chromium,Linux,编程技巧等相关文章等着您,我们还可以在线交流。

    【Android 桌面开发系列】电视Metro桌面开发一

     

    本文原始地址:http://www.coderonline.net/android-desktop-development-series-metro-tv-desktop-development.html

    本站所有文章,除特别注明外,均为本站原创,转载请注明出处来自http://www.coderonline.net/,将保留追究法律责任。

    关于

    发表评论

    表情 格式

    暂无评论

    切换注册

    登录

    忘记密码 ?

    切换登录

    注册