现象原因 #

苹果设计.glassEffect()时，加入了基于容器尺寸的动态透明度调整逻辑，模拟真实玻璃的视觉感知：

• 小尺寸容器（如60pt高度）：为避免过度遮挡背景，系统自动提高透明度、降低底色浓度，让视觉更通透
• 大尺寸容器（如100pt+高度）：为保证容器内内容可读性，减少背景干扰，系统会降低透明度、加深底色
• 这种效果变化是线性过渡的，目前未在官方文档中明确说明，但属于SwiftUI玻璃效果的默认设计行为

固定玻璃效果外观的解决方案 #

如果需要在不同尺寸容器中保持一致的玻璃效果，可通过以下两种方式实现：

方案1：自定义玻璃效果（完全替代系统实现） #

直接封装UIVisualEffectView为SwiftUI视图，手动控制模糊程度和透明度，绕过系统的动态调整逻辑：

import SwiftUI
import UIKit

struct CustomGlassEffect: UIViewRepresentable {
    var blurStyle: UIBlurEffect.Style = .systemMaterial
    var fixedOpacity: CGFloat = 0.7 // 固定透明度
    
    func makeUIView(context: Context) -> UIVisualEffectView {
        let blurEffect = UIBlurEffect(style: blurStyle)
        let view = UIVisualEffectView(effect: blurEffect)
        view.alpha = fixedOpacity
        return view
    }
    
    func updateUIView(_ uiView: UIVisualEffectView, context: Context) {
        uiView.effect = UIBlurEffect(style: blurStyle)
        uiView.alpha = fixedOpacity
    }
}

// 使用示例
@available(iOS 16.0, *)
struct ContentView: View {
    @State private var containerHeight: CGFloat = 60
    
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                Text("Glass Effect Height Test")
                    .font(.title2.bold())
                    .padding(.top)
                
                Text("Drag the slider to change height and observe the background color change")
                    .font(.caption)
                    .foregroundStyle(.secondary)
                    .multilineTextAlignment(.center)
                    .padding(.horizontal)
                
                // 高度可调的容器，使用固定玻璃效果
                VStack(spacing: 8) {
                    Text("Height: \(Int(containerHeight))pt")
                        .font(.headline)
                    
                    Slider(value: $containerHeight, in: 40...300, step: 5)
                }
                .padding()
                .frame(height: containerHeight)
                .frame(maxWidth: .infinity)
                .background(
                    CustomGlassEffect(fixedOpacity: 0.7)
                        .clipShape(RoundedRectangle(cornerRadius: 20))
                )
                .padding(.horizontal, 16)
            }
            .padding(.bottom, 50)
        }
        .background(Color(uiColor: .secondarySystemGroupedBackground))
    }
}

方案2：固定系统玻璃效果的参考尺寸 #

通过给玻璃效果层设置固定的参考高度，让系统基于该尺寸计算透明度，而非外层容器的实际高度：

@available(iOS 16.0, *)
struct ContentView: View {
    @State private var containerHeight: CGFloat = 60
    
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                // 其他内容保持不变
                
                // 高度可调的容器，固定玻璃效果参考尺寸
                VStack(spacing: 8) {
                    Text("Height: \(Int(containerHeight))pt")
                        .font(.headline)
                    
                    Slider(value: $containerHeight, in: 40...300, step: 5)
                }
                .padding()
                .frame(height: containerHeight)
                .frame(maxWidth: .infinity)
                .background(
                    Color.clear
                        .frame(height: 60) // 固定参考高度为60pt
                        .glassEffect(.regular, in: RoundedRectangle(cornerRadius: 20))
                        .allowsHitTesting(false) // 不影响容器内交互
                        .frame(maxHeight: .infinity) // 拉伸至容器实际高度
                )
                .padding(.horizontal, 16)
            }
            .padding(.bottom, 50)
        }
        .background(Color(uiColor: .secondarySystemGroupedBackground))
    }
}

注意事项 #

• 方案1可完全自定义透明度和模糊风格，但需手动适配深色模式（可通过@Environment(\.colorScheme)切换UIBlurEffect.Style）
• 方案2更贴近系统原生效果，但仅能固定基于某个参考尺寸的外观，无法直接调整透明度

内容的提问来源于stack exchange，提问作者Mircea Dragota