uni-app 隐藏iphone底部白色横线

发布于 1周前 作者 yibo5220 来自 Uni-App

uni-app 隐藏iphone底部白色横线

如题

3 回复

是ios自带的那个还是安全区里的? 自带的是系统的操作的,应该是没办法去掉 安全区是可以设置的 参考下 https://uniapp.dcloud.net.cn/tutorial/darkmode.html#ios-安全区域适配


不用安全区,就是单纯的想隐藏掉,有办法吗?

uni-app 开发中,如果你希望在 iPhone 设备上隐藏底部的白色横线(也称为“Home Indicator”),这通常涉及到对原生 iOS 的一些设置。由于 uni-app 是一个使用 Vue.js 开发多端应用的框架,它本身并不直接提供针对原生 iOS 设置的 API。不过,你可以通过自定义原生插件或者使用条件编译的方式来实现这一功能。

以下是一个通过自定义原生插件来隐藏 iPhone 底部白色横线的示例。假设你已经熟悉如何创建和配置 uni-app 的原生插件。

步骤 1: 创建原生插件

首先,你需要为 iOS 平台创建一个原生插件。在 native-plugins 目录下创建一个新的插件目录,比如 HideHomeIndicator

iOS 插件代码 (HideHomeIndicator/ios/HideHomeIndicator.m)

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface HideHomeIndicator : NSObject

+ (void)hideHomeIndicator;

@end

@implementation HideHomeIndicator

+ (void)hideHomeIndicator {
    if (@available(iOS 11.0, *)) {
        UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
        if (keyWindow) {
            for (UIView *subview in keyWindow.subviews) {
                if ([NSStringFromClass([subview class]) hasSuffix:@"StatusBar"]) {
                    UIView *statusBarForegroundView = subview;
                    for (UIView *statusBarSubview in statusBarForegroundView.subviews) {
                        if ([NSStringFromClass([statusBarSubview class]) isEqualToString:@"UIStatusBar_Modern"]) {
                            for (UIView *statusBarModernSubview in statusBarSubview.subviews) {
                                if ([NSStringFromClass([statusBarModernSubview class]) hasPrefix:@"UIStatusBar"]) {
                                    for (UIView *privateSubview in statusBarModernSubview.subviews) {
                                        if ([privateSubview respondsToSelector:@selector(setPrefersHomeIndicatorAutoHidden:)]) {
                                            [privateSubview performSelector:@selector(setPrefersHomeIndicatorAutoHidden:) withObject:@YES];
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@end

步骤 2: 调用原生插件

在你的 uni-app 项目中,通过 plus.bridge.exec 方法调用这个原生插件。

if (process.env.PLATFORM === 'ios') {
    plus.bridge.exec('HideHomeIndicator', 'hideHomeIndicator', [], function(e) {
        console.log('Home indicator hidden:', e.message);
    });
}

注意

  1. 上述代码示例使用了私有 API,这可能会导致 App Store 审核不通过。
  2. 更好的做法是使用苹果官方支持的 API,但遗憾的是,苹果并没有提供直接隐藏 Home Indicator 的公开 API。
  3. 在实际开发中,请确保你的插件代码遵循苹果的开发指南和隐私政策。

通过这种方式,你可以在 uni-app 项目中为 iOS 设备隐藏底部的白色横线。

回到顶部