Android TV开发总结(二)构建一个TV Metro界面(仿泰捷视频TV版)

前言:上篇是介绍构建TV app前要知道的一些事儿,开发Android TV和手机本质上没有太大的区别,屏大,焦点处理,按键处理,是有别于有手机和Pad的实质区别。今天来介绍TV中Metro UI风格,并结合实例说明。

Android TV发展离不开Metro UI,先看最新的泰捷TV的会员区效果,属于典型的Metro风格,如下:

什么是Metro UI:

Metro的设计意念来源于交通局巴士站站牌机场和地铁的指示牌给了微软设计团队灵感,设计团队说Metro是来源于美国华盛顿州金县都会交通局(King County Metro)的标识设计,其风格大量采用大字体,能吸引受众之注意力。微软认为Metro设计[2] 主题应该是:“光滑、快、现代”。Metro的图标设计也会不同于Android和iOS。

Metro UI软件

Metro是微软为了方便开发者编写Metro风格的程序而提供的一个开发平台,可以调用微软WinRT暴露出来的接口编写Metro风格的程序。 而Metro风格的控件[3] 拓展Win8标准控件方法和属性,实现一些新的功能,如Component One Studio for WinRT XAML,Component One Studio for WinJS。在Windows8中开放的Windows应用程序市场也使用并推荐采用Metro风格界面的应用程序.

Metro 界面,开机后首先映入眼帘的第一个界面,个人感觉主要是为了触屏设备而设计的,但是在TV中使用起来也一样的方便。我们在Desktop中安装的程序以及 在应用商店中下载的程序都会在Metro中展现出来,所以我们要定期或不定期的对其进行分组、排序、整理,以方便我们的操作以及界面的美观。Metro界面同时提供了便捷的选项,使操作更加方便。

案例效果

今天来仿照并实现这个Metro界面,以下是我实现的效果图:

gif图:(TV上没有好的录屏工具,盒子系统一般低于5.0,有些厂商已经升到5.0,我用的是i71,很老的盒子,基于API 17, 4.2.2的系统)

源码分析

看下其中一个MetroItem的布局:

每一个MetroItemFrameLayout下包含一些子View,ImageView就是对应图片,CornerVew表示上下左右的的角标,TextView表示下方的描述,这些可视具体情况进行选择。

?其他相关代码,下篇博客具体分析。案例已开源到Github,对应链接:https://github.com/hejunlin2013/TVSample。喜欢可以star.

License

Copyright (C) 2016 hejunlin

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

第一时间获得博客更新提醒,以及更多android干货,源码分析,欢迎关注我的微信公众号,扫一扫下方二维码或者长按识别二维码,即可关注。

如果你觉得好,随手点赞,也是对笔者的肯定,也可以分享此公众号给你更多的人,原创不易

时间: 2024-10-16 11:02:08

Android TV开发总结(二)构建一个TV Metro界面(仿泰捷视频TV版)的相关文章

Android UI开发——使用Fragment构建灵活的桌面

当我们设计应用程序时,希望能够尽最大限度的适配各种设备,包括4寸屏.7寸屏.10寸屏等等,Android开发文档给了我们参考,而且Google  IO的app(如图二)也实现了这种思想,他们都是使用layout.layout-large里面不同的布局文件实现的.当设计应用程序,你可以在不同的布局结构中重复使用Fragment,以支持众多的屏幕尺寸,,在可用的屏幕空间上优化用户体验.例如在手持设备(如Nexus 4)上,一个屏显示一个Fragment,在更大屏(如Nexus 7)上可以使用多个Fr

Android ROM开发(二)——ROM架构以及Updater-Script脚本分析,常见的Status错误解决的方法

Android ROM开发(二)--ROM架构以及Updater-Script脚本分析,常见的Status错误解决的方法 怪自己二了.写好的不小心弄没了,如今仅仅好又一次写一些了.上篇简单的配置了一下环境.这里呢,就来讲一下相关的仅仅是点 我们先下载一个ROM.随便下,原理都是差点儿相同的,这里我就下载一个红米Note的MIUI稳定版 1.ROM结构 ROM依据厂商的定制可能有所不同,可是大体是不变的 data 内置一些软件 META-INF 脚本文件 update-binary 二进制文件 u

Android Afinal框架学习(二) FinalActivity 一个IOC框架

框架地址:https://github.com/yangfuhai/afinal 对应的源码: net.tsz.afinal.annotation.view.* FinalActivity FinalActivity是一个基础类,结合注解实现了,依赖注入(view的资源id,常用的监听器), 利用set方式注入 完全注解方式就可以进行UI绑定和事件绑定,无需findViewById和set event Listener 这个过程:initInjectedView>findViewById.set

ubuntu下进行android的开发(二):android开发环境搭建

android开发环境搭建主要分两个步骤:安装JDK及安装集成开发环境. 一.安装JDK ubuntu系统自带的有openJDK,要开发android还是需要去官网下载JDK(1.6以上).当前系统JDK版本可以通过java -version指令来查看. 到oracle官网http://www.oracle.com/technetwork/java/javase/downloads/index.html下载最新的JAVA SE开发环境(JDK),我这里下载的是jdk-8u11-linux-x64

Android Wear 开发入门——如何创建一个手机与可穿戴设备关联的通知(Notification)

创建通知 为了创建在手机与可穿戴设备中都能展现的通知,可以使用 NotificationCompat.Builder.通过该类创建的通知,系统会处理该通知是否展现在手机或者穿戴设备中. 导入必要的类库 在开发之前首先需要导入以下类库 importandroid.support.v4.app.NotificationCompat; importandroid.support.v4.app.NotificationManagerCompat; importandroid.support.v4.app

Android TV 开发笔记二:创建第一个Android TV App

一:创建 New Project 1. 2. 3. 4. 创建成果后发现已经帮你创建好了一些demo页面,并且数据都已经绑定好了 二:解决错误 1.创建成功后,build发现报错了,如下: 这个错误是因为版本问题导致的 解决方法,将版本号修改为以下的: 接着又会报错: 作为一个程序员,这点小错误相信难不倒你,自己解决吧,是HeaderItem用的构造函数不对导致的 至此终于得到了一个可以运行的AndroidTV Demo

android ndk开发(二)实现一个官方demo

实现了一个官方的demo:bitmap-plasma(水波纹) 源代码就在samples文件夹下,可以自己去找. 界面: 建立项目的步骤和配置环境不明白的可以去看:http://www.cnblogs.com/jycboy/p/5393727.html 一.activity代码: package example.user.plasmatest; import android.os.Bundle; import android.app.Activity; import android.os.Bun

安卓Tv开发(二)焦点控制(键盘事件)

上篇文章中说道了触控事件,但是只对MotionEvent做了细说,很多东西还是不懂怎么用触控事件,现在就做对上篇的补充吧 在view重写onTouchEvent方法,通过event.getAction()对不同的enent就可以处理了,代码如下 public boolean onTouchEvent(MotionEvent event) { int events[] = {MotionEvent.ACTION_DOWN, MotionEvent.ACTION_MOVE, MotionEvent.

Android 游戏开发(二)SurfaceView初探

SurfaceView游戏框架在游戏开发当中有举足轻重的地位.SurfaceHolder类是用来控制SurfaceView的大小.格式,并且主要用于监听Surface的状态.SurfaceView好像就是一块内存数据里面记录着数据,更改数据而是由SurfaceHolder来控制,使用SurfaceHolder的lockCanvas()函数来获取SurfaceView的Canvas对象.然后在Canvas上绘制内容来修改SurfaceView中的数据. import android.content