常见问题与优化建议
阴影过重/黑边:减小 box-shadow 的透明度和模糊半径。
圆角割裂:所有玻璃层都要加 border-radius。
背景不通透:确保 glass-effect 层有 blur 和 SVG filter。
性能问题:backdrop-filter 在低端设备上可能有性能损耗,建议只在必要区域使用。
浏览器兼容性:backdrop-filter 需现代浏览器支持,IE/部分            
                
         
            
            
            
            Vue实现一个“液态玻璃”效果登录卡片效果介绍液态玻璃(Liquid Glass)是一种极具现代感的UI视觉风格,常见于高端网站和操作系统界面。它通过多层叠加、模糊、光泽、滤镜等技术,模拟出玻璃的通透、折射和高光质感。苹果的这次系统设计更新,带火了这一设计效果,本教程将带你一步步实现一个带有3D灵动倾斜交互的液态玻璃登录卡片。实际效果:技术原理解析1. 多层叠加液态玻璃效果的核心是多层视觉叠加:模            
                
         
            
            
            
            液态玻璃(Liquid Glass)是一种极具现代感的 UI 视觉风格,常见于高端网站和操作系统界面。它通过多层叠加、模糊、光泽、滤镜等技术,模拟出玻璃的通透、折射和高光质感。苹果的这次系统设计更新,带火了这一设计效果,本教程将带你一步步实现一个带有 3D 灵动倾斜交互的液态玻璃登录卡片。            
                
         
            
            
            
            苹果iOS26系统即将正式推送,带来液态玻璃视觉特效和Apple Intelligence智能升级。本文深入体验新特性,讨论兼容从iPhone11到SE系列的老机型,分析可能出现的发热和续航问题,并提供升级策略。            
                
         
            
            
            
            9 月 15 日,iOS 26 就要正式推送了。苹果这次摆明要用“视觉+智能”两手抓,让人忍不住想问:这波更新,是真香还是套路?
这代 iOS 最大的噱头是“液态玻璃”。
听着玄乎,其实就是系统动画和过渡效果被彻底重构了。你滑动时,那种“像玻璃流动”的顺滑感会更自然,页面切换不再生硬,甚至有点像拿着一块透明水晶在手里翻转。
苹果以前就靠细节征服用户,这回算是把“看起来顺”再次拉满。对比安卓阵营的高            
                
         
            
            
            
             
相信学习过Ps的人都知道Ps的渐变工具。不同颜色渐变中的过渡效果在UI设计的背景与插画画报中经常见到,给人很强的节奏感和审美情趣。渐变的形式不仅在日常生活中随处可见,许多自然现象也都充满了渐变的形式特点,如彩虹、极光等。将渐变与3d物体结合起来能使画面更加丰富,给人更强的视觉冲击力。那么接下来就为大家介绍如何制作液态渐变效果。
1 成品
图1.1
图1.2
2 思路
在看到图片的时候,            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-22 11:13:20
                            
                                581阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            欢迎点击「算法与编程之美」↑关注我们!本文首发于:"算法与编程之美",欢迎关注,及时了解更多此系列文章。欢迎加入团队圈子!与作者面对面!直接点击!相信学习过Ps...            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-03-01 15:34:36
                            
                                304阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            因为苹果下一代iPhone有可能采用液态金属的谣言,所以我们最近老听到液态金属这个玩意。到底什么是液态金属?它有什么独特的地方值得苹果把它应用到自己的产品上?大家将会从发明者Atakan Peker获得答案。液态金属这玩意其实在2010年已经出现,为什么拥有该专利的苹果到现在还没把它应用到产品设备上?一个外国媒体网站(BusinessInsider)对液态金属发明人中的一员Atakan Peker            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2012-05-03 11:08:59
                            
                                68阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            App设计时往往会用到一些模糊效果或者毛玻璃效果,iOS目前已提供一些模糊API可以让我们方便是使用。 话说苹果在iOS7.0之后,很多系统界面都使用了毛玻璃效果,增加了界面的美观性,比如下图的通知中心界面;  但是其iOS7.0的SDK并没有提供给开发者实现毛玻璃效果的API,所以很多人都是通过一些别人封装的框架来实现,后面我也会讲到一个; 其实在iOS7.0(包括)之前还是有系统的类可以实现            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-07-20 09:00:16
                            
                                146阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            桌面杂乱不但影响工作效率,还会影响工作心情。在年初腾讯电脑管家发布12.0后正式推出了桌面整理工具,从而取代了停更近两年的小Q桌面。对于有强迫症的人来说,桌面整理正是刚需。不知道各位有没有听说过两款很神奇的软件,一款叫做WallpaperEngine,一款叫做火萤视频桌面,它们能将你喜欢的视频,设置成动态桌面壁纸,现在很火的那个steam动态壁纸就是通过该软件实现的!但事实上腾讯电脑管家的桌面整理            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-07-29 14:04:18
                            
                                191阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            导读规模电能存储技术在有效利用可再生能源、构建智能电网、提高电能质量等领域的重要性日益凸显。液态金属电池作为一类新型储能电池技术,其电解质和正负极分别采用无机熔盐和液态金属,具有成本低、容量大、效率高、寿命长等特点,在规模储能领域具有广阔的应用前景。本文主要从电池设计和体系优化等方面介绍液态金属电池的重要研发进展,分析其主要技术挑战,在此基础上提出了面向电力储能应用的新型液态金属电池的发展方向。引            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-04-29 14:44:00
                            
                                4857阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            内置shader修改:Shader "Custom/ReflectEnv" {	Properties {		_Color ("Color", Color) = (1,1,1,1)		_MainTex ("Albedo (RGB)", 2D) = "white" {}		_Glossiness ("Smoothness", Range(0,1)) = 0.5		_Metallic ("Me.            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-11-18 16:44:47
                            
                                421阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            Android 弹窗毛玻璃背景实践需求: 点击FloatingActionButton弹出弹层,弹层底部有多个图标可选,每一个图标都是一个功能入口,背景采用毛玻璃模糊效果。记录一下这个需求的思考和实现过程。查找Android原生API做法在Android API里面,有个FLAG_BLUR_BEHIND用于模糊背景的FLAG,尝试一下使用它来做Dialog的背景模糊。  代码如下:final Di            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-08-24 00:17:15
                            
                                170阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            毛玻璃效果从ios流行,逐渐已经成为很多Android应用的设计选项那么到底毛玻璃效果是什么呢?毛玻璃效果其实是常说的高斯模糊。高斯模糊的原理中,它是根据高斯曲线调节像素色值,它是有选择地模糊图像。说得直白一点,就是高斯模糊能够把某一点周围的像素色值按高斯曲线统计起来,采用数学上加权平均的计算方法得到这条曲线的色值,最后能够留下人物的轮廓,即曲线。Java 实现(来自复制粘贴)public sta            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-09-05 13:58:40
                            
                                166阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            作者:dinglin背景我又双叒叕来摸鱼啦!!今天又双叒叕是做需求,发现产品给了一个缩略图排列起来的列表(虽然列表里只给了一个排列项,其他需要脑补)然鹅我发现!想象总是美好的,然而现实是非常骨感的!什么是毛玻璃效果?毛玻璃效果(Glassmorphism)是目前非常流行的设计新趋势,你可以在 Dribbble 等网站上看到毛玻璃效果,甚至像 Apple 和 Microsoft 这样的大公司也在使用            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-10-04 10:12:31
                            
                                143阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            原标题:毛玻璃的性质及功能特点在现代生活中,无论是在实用性上,还是在装饰性上,玻璃都有着很大的用途。出于实际的需要,玻璃的品种也越来越多,玻璃的工艺水平也在不断提高。毛玻璃就是一种具有很强工艺性的产品。一、毛玻璃的性质由于表面粗糙,使光线产生漫反射,透光而不透视,它可以使室内光线柔和而不刺目。它是一种用金刚石等粗糙不平整的半透明玻璃经过磨砂或者化学处理过的玻璃,它通常用于浴室门窗。二、毛玻璃的功能            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-11-16 20:14:30
                            
                                153阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            毛玻璃效果实际上是对原图片的严重劣化,突出朦胧感,一般都是通过图片的缩放+模糊算法来实现,从性能角度考虑,模糊半径不能大于25,所以要更高的模糊效果则需要进行缩放。具体实现方案有以下几种。Java实现,一般都是采用Stack模糊算法
RenderScript实现Native实现OpenCV或者OpenGL实现,由于其复杂度,本文暂不讨论该方案1、Java实现Java代码实现毛玻璃效果基本上都是采用            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-11-01 11:12:52
                            
                                203阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            进过一番预研,找到了3中实现方案,其中各有优缺点:1、如果系统的api在16以上,可以使用系统提供的方法直接处理图片 if (VERSION.SDK_INT > 16) {
            Bitmap bitmap = sentBitmap.copy(sentBitmap.getConfig(), true);
            final RenderScrip            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-06-06 10:52:01
                            
                                121阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            玻璃材质要知道玻璃的实现原理那么首先要知道玻璃的原理。在现实世界的情况下:1.在正常透明不模糊的玻璃下,透过玻璃看外界,基本上和不用玻璃没有太大差别。基本上就是透视。2.在模糊的玻璃下,透过玻璃看外界,可以看到因为玻璃模糊导致透过玻璃看到的外界画面有点扭曲不清楚的感觉。这是一种模糊的扰动现象。3.在漆黑的玻璃下,或者晚上,我们透过正常不模糊的玻璃看想外界时会发现看不到任何东西,反而看到的是自己在镜            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-05-23 15:49:08
                            
                                614阅读
                            
                                                                             
                 
                
                                
                    