TileIndex一个Win10磁贴风格的个人索引页

最新推荐文章于 2024-06-03 09:42:34 发布
原创 最新推荐文章于 2024-06-03 09:42:34 发布 · 426 阅读 · 5 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue

作者开发了一款Win10磁贴风格的个人索引页，利用Vite和Vue实现，注重跨设备适配，特别适用于移动端。项目基于Github仓库CairBin/TileIndex，鼓励星标支持。

TileIndex一个Win10磁贴风格的个人索引页

原因

随着所用平台的增多，于是突发奇想写了一个个人索引页，来部署到服务器或者Github Page。

在Github上也有很多类似的项目，但对于我个人而言都不太喜欢。

在设计的时候也十分纠结，到底要写一个什么样式的索引页，然后就想到了被微软砍掉的动态磁贴（有的人讨厌这东西，但我觉得挺好看的）。

Github仓库

Github仓库地址:

CairBin/TileIndex

如果喜欢请给个Star。

项目展示

使用Vite+Vue做的，对不同分辨率的设备做了适配确保移动端能够正常显示，在页面底部调用了一言的API。

TileBeautify:win10磁贴美化工具
04-23
一个win10磁贴美化工具 我的第一个C#开源程序，代码量达到1700行 请原谅本人英语渣，变量命名都用的中式英语chinglish 功能 自定义磁贴背景颜色 自定义磁贴文字颜色（黑、白） 显示\隐藏磁贴文字 图片裁切，制作拼图...
Win10 磁贴修改工具 自定义磁贴
12-20
"Win10 磁贴修改工具"就是为了迎合这些个性化需求而设计的，它允许用户根据自己的喜好调整磁贴的外观和布局，从而打造一个更加整洁、符合个人审美的启动屏幕。 首先，让我们深入了解一下Win10磁贴修改工具的主要...
模仿去哪儿的磁贴效果
小源
10-29 3853
感觉去哪儿的页面做的非常不错，非常好看，于是想模仿一下，其实实现还是很简单的，就是按下去的执行缩小动画，抬起的恢复正常状态，这种效果叫磁贴效果，顾名思义感觉就磁贴一样。下面我们来看看效果图： 下面我们来看看最重要的自定义代码： package com.zqy.qunertext; import android.content.Context; import android.grap
探索未来界面设计：Vue-Metro-Tile 开源组件
最新发布
gitblog_00047的博客
06-03 455
探索未来界面设计：Vue-Metro-Tile 开源组件 项目简介 在寻找一个能够为你的Web应用注入独特视觉体验的组件吗？那么Vue-Metro-Tile可能是你一直在找的答案。它是一个基于Vue.js构建的开源组件，旨在模拟Windows 10风格的地铁磁贴布局，提供了一种创新且现代的用户界面设计方式。 项目技术分析 Vue-Metro-Tile组件充分利用Vue.js的灵活性和响应式特性，实...
磁贴布局 - 功能分析
chengbo_eva的博客
07-19 473
磁贴布局 - 功能分析
磁贴布局 - 功能实现
chengbo_eva的博客
07-19 328
磁贴布局 - 功能实现
精读《磁贴布局 - 功能实现》
前端精读周刊
12-12 347
经过上一篇 精读《磁贴布局 - 功能分析》 的分析，这次我们进入实现环节。精读实现磁贴布局前，先要实现最基础的组件拖拽流程，然后我们才好在拖拽的基础上增加磁贴效果。基础拖拽能力对布局抽象来说，它关心的就是 可拖拽的组件 与 容器 的 DOM，至于这些 DOM 是如何创建的都可以不用关心，在这个基础上，甚至可以再做一套搭建或者布局框架层，专门实现对 DOM 的管理，但这篇文章还是聚焦在布局的实现层。...
Win10风格Html模板
04-08
Win10-UI是一款win10风格的后台UI框架。它使用了丰富的win10桌面元素，包括桌面图标、窗口化子页面管理、开始菜单、动态小磁贴等组件，兼容主流现代浏览器及移动端的屏幕尺寸，适合快速开发后台管理系统的前端界面
有爱自取[MetroTileEdit]Win10磁贴美化工具
04-05
这对于经常需要切换不同工作环境或者喜欢定期变换桌面风格的用户来说，无疑是一个非常实用的功能。 值得注意的是，虽然 MetroTileEdit 提供了丰富的自定义选项，但并不是所有的修改都会立即在开始菜单中显示。部分...
自定义Win10磁贴的工具：磁贴修改器
综上所述，通过自定义Win10磁贴，用户可以打造出一个更加个性化、高效和有序的工作环境。而使用第三方磁贴修改工具，不仅可以简化定制过程，还能提供更多高级的定制选项。不过，用户在使用这些工具时应谨慎，确保...
使用JS配合CSS实现Windows Phone中的磁贴效果
12-13
Windows Phone的tile设计的美丽对我来说有余音绕梁的效果。我从来不知道优雅的方块盒子布局能给我深刻的印象。因此我尝试在web里用CSS和Jquery去实现这种tile设计。我已尝试Tile Flip动画效果，它能展示两种不同的信息一个在tile的前端而另外一个就在后端。  Demo Download 首先我们要为tile创建和下面图片的效果一样的HTML的内容。每个tile包含了两个分别在前后的div。他们都能包含要展示的信息。下面的html代码生成所需的tile布局。 tile设计包含了CSS的类名 CSS Code复制内容到剪贴板 <div class="con
用于渲染虚假渐进内容的可组合vue组件类似Facebook的实现
08-12
用于渲染虚假（渐进）内容的可组合vue组件，类似Facebook的实现
网页磁贴模板_文本磁贴（登录）模板 (HTML)
weixin_42112658的博客
01-14 457
文本磁贴(登录)模板 (HTML)03/04/2016本文内容[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发，请参阅 最新文档 ]定义一个表示磁贴的项，该项包含两部分，一部分是较大的粗体文本，另一部分是较小的文本。 此模板可以与具有网格布局的 ListView 结合使用。有关更...
Vue学习踩坑记录
ai520587的博客
09-12 267
学如逆水行舟，不进则退。进了新公司，里面都是高材生，我这种菜鸟得跟上脚步才行，努力追赶，上一家公司用的技术太low了，现在的新公司用了vue，学习一下，踩坑中。。。 一、Vue项目环境搭建 二、Vue项目问题集 ‘webpack-dev-server’不是内部或外部命令，也不是可运行的程序或批处理文件 三、Vue组件之间的通信交互...
VUE3-Cesium（Cesium3DTileStyle-3dtiles样式更改）
damadashen的博客
06-14 9023
Cesium中3dtile模型样式的给更改，Cesium3DTileStyle详解及案例
VUE3-Cesium（3dtiles加载与设置）
damadashen的博客
06-23 3877
cesium中3DTiles数据的详解及加载、性能监控、样式更改。
全屏动态磁贴
LigeLaige...
03-30 1352
本程序改进自MetroTile（下载页面为http://download.youkuaiyun.com/detail/programmer_xyl/5425135#comment） 界面以全屏显示，随机生成并排列磁贴 下载链接为： https://github.com/LigeLaige/MyTitle.git http://download.youkuaiyun.com/detail/huangjinqia
实现磁贴的效果的一种方法
weixin_30354675的博客
06-23 1294
由于今年win8的那种磁贴效果比较流行，所以我们的项目决定使用这种磁贴。经过在网上的搜索查询，有一位大神的效果看起来比较炫酷，所以特下载下来进行了钻研，在基本弄懂了实现方法后，特在此总结，以备以后的使用。 有以下几点需要说明： 1>磁贴的图片是自己用ps根据手机的像素和hpi扣出来的，是一种纯色块。 2>磁贴的缩放特效是Matrix实现的。 3>磁贴的旋转...
vue组件横向树实现
若晨工作室
08-01 7849
将之前的用css3+jq实现的横向树样式简单封装成组件使用到vue项目中，文件名为transverseTree.vue 代码： &lt;template&gt; &lt;div class="tree"&gt; &lt;ul v-if="treeData &amp;&amp; treeData.length"&gt; &lt;li v-for=
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值