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干货,源码分析,欢迎关注我的微信公众号,扫一扫下方二维码或者长按识别二维码,即可关注。
如果你觉得好,随手点赞,也是对笔者的肯定,也可以分享此公众号给你更多的人,原创不易
Android TV开发总结(二)构建一个TV Metro界面(仿泰捷视频TV版)的更多相关文章
- TV Metro界面(仿泰捷视频TV版)源码解析
转载请把头部出处链接和尾部二维码一起转载,本文出自逆流的鱼yuiop:http://blog.csdn.net/hejjunlin/article/details/52822499 前言:上一篇介绍了 ...
- Android TV开发总结(四)通过RecycleView构建一个TV app列表页(仿腾讯视频TV版)
转载请把头部出处链接和尾部二维码一起转载,本文出自逆流的鱼yuiop:http://blog.csdn.net/hejjunlin/article/details/52854131 前言:昨晚看锤子手 ...
- Android NFC开发(二)——Android世界里的NFC所具备的条件以及使用方法
Android NFC开发(二)--Android世界里的NFC所具备的条件以及使用方法 NFC的应用比较广泛,而且知识面也是比较广的,所以就多啰嗦了几句,我还还是得跟着官方文档:http://dev ...
- Android ROM开发(二)——ROM架构以及Updater-Script脚本分析,常见的Status错误解决办法
Android ROM开发(二)--ROM架构以及Updater-Script脚本分析,常见的Status错误解决办法 怪自己二了,写好的不小心弄没了,现在只好重新写一些了,上篇简单的配置了一下环境, ...
- 安卓Tv开发(二)移动智能电视之焦点控制(按键事件)
原文:http://blog.csdn.net/sk719887916/article/details/44781475 skay 前言:移动智能设备的发展,推动了安卓另一个领域,包括智能电视和智能家 ...
- 【Android Developers Training】 3. 构建一个简单UI
注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...
- 关于Android App开发知识体系的一个小总结
前言 本文从热更新.异步并发.性能优化.网络请求等多个方面对Android App开发的知识体系进行了一个分类总结.欢迎大家沟通交流. 热更新 [原]热更新开源项目Tinker源码解析之Dex热更新 ...
- Android NDK 开发(二) -- 从Hlello World学起【转】
转载请注明出处:http://blog.csdn.net/allen315410/article/details/41805719 上篇文章讲述了Android NDK开发的一些基本概念,以及NDK ...
- Android Wear 开发入门——怎样创建一个手机与可穿戴设备关联的通知(Notification)
创建通知 为了创建在手机与可穿戴设备中都能展现的通知,能够使用 NotificationCompat.Builder.通过该类创建的通知,系统会处理该通知是否展如今手机或者穿戴设备中. 导入必要的类库 ...
随机推荐
- 从零开始系列之vue全家桶(1)安装前期准备nodejs+cnpm+webpack+vue-cli+vue-router
写在前面: 什么是全家桶? 包含了vue-router(http://router.vuejs.org),vuex(http://vuex.vuejs.org), vue-resource(https ...
- Jenkins配置Gogs webhook插件
前言 我们在前面使用Jenkins集合Gogs来进行持续集成的时候,选择的是Jenkins定时检测git仓库是否有更新来决定是否构建.也就是说,我们提交了代码Jenkins并不会马上知道,那么我们可以 ...
- IIS&ASP.NET 站点IP跳转到域名
前言:先到微软的 https://www.iis.net/downloads/microsoft/url-rewrite 下载URL Rewrite 目标:输入ip跳转到域名所在的网站 比如58的1 ...
- [Codeforces]852I - Dating
题目大意:给定一棵n个点的树,每个点上有一个汉子或妹子,每人有一个权值,每次询问一条链上选出一对权值相等的男女有多少种选法.(n,q<=10^5) 做法:比较显然的树上莫队,熟悉序列莫队那套理论 ...
- ●SPOJ LCS2Longest Common Substring II
题链: http://www.spoj.com/problems/LCS2/题解: 后缀自动机. 对第一个串建立后缀自动机, 然后把后面的每个串分别与该串的自动机去匹配,求出相应的数组val*[s]: ...
- 51 nod 1439 互质对(Moblus容斥)
1439 互质对 题目来源: CodeForces 基准时间限制:2 秒 空间限制:131072 KB 分值: 160 难度:6级算法题 有n个数字,a[1],a[2],…,a[n].有一个集合,刚开 ...
- 【NOIP2012TG】solution
D1T1(Vigenere) 题意:给你一个原串与一个密码串,问你按照题意规则加密后的密文. 解题思路:暴力模拟. #include <stdio.h> ],c[],u1[],u2[]; ...
- HDU 4787 GRE Words Revenge
Description Now Coach Pang is preparing for the Graduate Record Examinations as George did in 2011. ...
- hdu 5130(2014广州 圆与多边形相交模板)
题意:一个很多个点p构成的多边形,pb <= pa * k时p所占区域与多边形相交面积 设p(x,y), (x - xb)^2+(y - yb)^2 / (x - xa)^2+(y ...
- Java Servlet 笔记4
Servlet 客户端 HTTP 请求 当浏览器请求网页时,它会向 Web 服务器发送特定信息,这些信息不能被直接读取,因为这些信息是作为 HTTP 请求的头的一部分进行传输的. 读取 HTTP 头的 ...