【免费下载链接】webhtv基于鱼佬的WebHomeTV二次开发调整了部分交互方式支持Python和JavaScript源的TMDB海报。项目地址https://gitcode.com/gh_mirrors/web/webhtv点击查看免费下载WebHomeTVWebHTV是一款支持WebHome 自定义首页的开源电视/手机端应用它允许你用一份HTML CSS JS网页完全接管 App 首页的外观与交互并通过内置fmSDK 读取内容源数据、调用原生播放。这篇入门教程带你从零把专属电视首页搭起来——不需要会 Java只要会写网页就行。什么是 WebHome 自定义首页WebHome 的核心思路是“网页皮肤 原生能力”网页负责首页布局、卡片样式、分类筛选、动画效果全部用 HTML/CSS/JS 实现原生负责取数、播放、搜索、设置等核心功能通过注入的fmSDK 暴露给网页调用一份页面双端运行同一份 HTML 在手机触屏和 Android TV遥控器上都能工作。最大的好处是皮肤与内容源解耦换内容源时首页数据自动切换页面代码一行不用改页面出问题时关闭全局皮肤即可回退原生首页不会卡死。完整协议说明见 docs/universal-webhome-theme-development.md。快速启用三种开启方式手机和电视版入口相同设置 → 增强设置 → 全局 WebHome 皮肤共有三个选项选项说明关闭使用原生首页Eclipse 内置皮肤随 APK 发布的离线演示皮肤推荐新手先看自定义网址输入https://地址加载你自己的主题页保存后立即刷新首页无需重启应用。注意应用只接受语法合法的 HTTPS 地址file://、私网 IP、HTTP 都会被拒绝首次启用远程 URL 时还会显示来源域名与风险确认。⚠️ 加载优先级规则内容源自带的 homePage 全局 WebHome 皮肤 原生首页。如果当前内容源声明了自己的homePage全局皮肤不会覆盖它。认识内置 Eclipse 皮肤新手最佳范例应用内置的Eclipse主题eclipse.html是一个完全离线的完整范例支持分类、筛选、自动分页滚动到末尾或焦点进入最后一行时预取下一页搜索、原生媒体库与设置入口手机 3 列 / 电视 1080p 下 6 列的响应式卡片布局D-pad 遥控焦点的几何方向移动与焦点恢复它还是 V2 主题的 Manifest 范例theme.json 声明了首页/详情页入口、每页权限和原生播放引擎新主题开发可以直接对照它写。动手写第一个首页最小骨架一份 WebHome 首页就是一个单文件 HTML。最小可用骨架如下完整版可参考 webhome-devkit/templates/homepages/basic-homepage.html!doctype html html langzh-CN head meta charsetutf-8 meta nameviewport contentwidthdevice-width,initial-scale1 titleMy WebHome/title style .card:focus { outline: 3px solid #fff; } /style /head body nav idclasses/nav main iditems/main script function start() { if (!window.fm || !fm.vodHome) return; fm.vodHome({}).then(function (result) { renderItems(result.items || []); }); } // SDK 是加载过程中注入的必须同时处理两种时机 window.addEventListener(fmsdk, start, false); if (document.readyState loading) { document.addEventListener(DOMContentLoaded, start, false); } else { start(); } function play(item) { fm.vod(item.siteKey, item.vodId, item.name, item.pic, {}); } function renderItems(items) { var root document.getElementById(items); root.innerHTML ; items.forEach(function (item) { var b document.createElement(button); b.className card; b.textContent item.name || 未命名; b.onclick function () { play(item); }; root.appendChild(b); }); } /script /body /html关键点只有一个不要假设页面加载时fm已存在。SDK 在 WebView 加载过程中注入要同时监听fmsdk事件和DOMContentLoaded上面的骨架已处理好。fm SDK 常用接口速查接口作用fm.vodHome({})读取当前内容源首页分类classes、筛选filters、条目itemsfm.vodCategory(typeId, page, options)按分类 页码 筛选条件分页取数fm.vod(siteKey, vodId, title, pic)打开原生详情/播放链路fm.search(keyword)打开原生搜索fm.openVod()/fm.openSetting()打开 VOD 媒体库 / 设置fm.ui.getViewport()获取可用视口方便做安全区布局几个实用细节分类结果里的hasMore是自动分页的首要依据pageCount 0表示未知非空页仍可继续请求渲染条目时优先用textContent不要把标题/简介直接拼进innerHTML防止源站文本破坏 DOM安全边界主题只能访问当前选中的内容源无法跨源读取或播放也不需要你处理 Cookie、代理等网络细节。电视遥控器焦点TV 端必做清单一份页面要同时服务触屏和遥控器TV 端要满足每个可操作元素必须有清晰的:focus样式不能只写:hover焦点边框与背景有足够对比度1080p 下卡片和文字清晰上下左右方向键必须有确定目标分类栏、筛选行是独立横向焦点行左右键行内移动、上下键跨行“加载更多”不能成为焦点终点焦点进入最后一行时预取下一页翻页、重新渲染、从播放器返回后按稳定 key 恢复焦点。内置 Eclipse 的做法是data-focus标记 data-focus-row约束横向导航 几何方向搜索可在 eclipse-focus-navigation.js 中参考其实现逻辑。旧 WebView 兼容与上线前检查电视固件的 Chromium/WebView 可能很旧写代码时请注意JS最高按 ES2017 编写避免可选链?.、空值合并??、逻辑赋值、moduleCSS不要把gap、aspect-ratio、clamp()、:has()当作关键布局的唯一实现优先 flex margin发布优先单文件 HTML图片设置onerror占位URL 使用 HTTPS 并保留可回滚的版本路径。项目提供了开发套件 webhome-devkit/其中包含首页模板、V2 主题的 Schema 与校验脚本。上线前建议用校验器检查 Manifestpython3 webhome-devkit/scripts/validate_webtheme.py path/to/theme.json --target mobile python3 webhome-devkit/scripts/validate_webtheme.py path/to/theme.json --target leanbackSchema 定义见 webtheme-v2.schema.jsonV2 架构与权限模型详见 docs/universal-webhome-theme-design.md。常见问题Q启用皮肤后首页没变化先确认当前内容源没有自带homePage它优先级更高再确认设置已保存设置会立即发送刷新事件。Q远程页面加载失败会怎样URL 非法、主文档加载失败或二次超时恢复仍失败时会自动回退原生首页不会卡死。日志可搜webhome、webhome-webview关键词定位。Q主题升级或想换新皮肤在设置里更换 URL 或关闭即可。远程皮肤请只配置自己维护或信任的 HTTPS 地址不要依赖第三方统计/广告脚本页面失效时关闭全局皮肤即可恢复原生首页。下一步建议先在设置里启用 Eclipse 皮肤熟悉交互 → 复制 basic-homepage.html 改样式 → 补上分类分页与焦点逻辑 → 用 devkit 校验后托管到 HTTPS 发布。动手写第一个专属电视首页只需一个 HTML 文件的距离 赞分享【免费下载链接】webhtv基于鱼佬的WebHomeTV二次开发调整了部分交互方式支持Python和JavaScript源的TMDB海报。项目地址https://gitcode.com/gh_mirrors/web/webhtv点击查看免费下载相关推荐5分钟打造专属应用仪表板自定义首页终极指南5分钟打造专属应用仪表板自定义首页终极指南 ho 是一款高度可定制的首页应用它能将你的各种服务和工具整合到一个直观的仪表板中。无论是Docker容器状态监控前端后端抖音无水印批量下载douyin-downloader 3 步落地指南从单条视频到整个博主主页抖音无水印批量下载douyin downloader 3 步落地指南从单条视频到整个博主主页 douyin downloader 是一个免费开源的抖音无水印网页爬虫CLI打造专属数字空间gethomepage/homepage自托管首页完全指南打造专属数字空间gethomepage/homepage自托管首页完全指南 在数字化时代如何高效管理众多应用和服务成为每个技术爱好者的挑战。gethomep前端后端上一篇如何把doubao-nomark当Python库嵌入项目两行代码提取豆包图片和视频下一篇Jolt Physics 样例程序Samples完全指南菜单、控制与测试场景解析创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考