IOS 设置UIViewController为背景半透明浮层弹窗,查看富文本图片详情

使用场景:UIViewController1 打开 UIViewController2(背景半透明弹窗)

案例:打开富文本网页<img>图片的url查看图片详情

WKWebView WKNavigationDelegate代理方法设置js代码点击事件

objectivec 复制代码
///注册添加图片标签点击js方法
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
    ///js添加图片点击事件
    NSString *jsClickImage =@"function registerImageClickAction(){var imgs=document.getElementsByTagName('img');var length=imgs.length;for(var i=0; i < length;i++){img=imgs[i];if(\"ad\" ==img.getAttribute(\"flag\")){var parent = this.parentNode;if(parent.nodeName.toLowerCase() != \"a\")return;}img.onclick=function(){window.location.href='image-preview:'+this.src}}}";
    
    [webView evaluateJavaScript:jsClickImage completionHandler:nil];
    [webView evaluateJavaScript:@"registerImageClickAction()" completionHandler:nil];
    
    [webView evaluateJavaScript:@"document.body.scrollHeight" completionHandler:^(id _Nullable result,NSError *_Nullable error) {
        //获取webView内容高度
        CGFloat height = [result doubleValue];
//        [webView mas_updateConstraints:^(MASConstraintMaker *make) {
//              make.height.equalTo(@(height));
//        }];
        webView.frame = CGRectMake(0, 0, self.frame.size.width, height);
        [webView layoutIfNeeded];
        [webView setNeedsLayout];
        if (self.contentHeightCallback != nil) {
            self.contentHeightCallback(CGSizeMake(self.frame.size.width, height));
        }
    }];
    
}

///拦截点击图片
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{
    NSString *requestString = navigationAction.request.URL.absoluteString;
    NSString *imgKey = @"image-preview";
    if([requestString hasPrefix: imgKey]){
        NSString *url = [requestString substringFromIndex:imgKey.length+1];
        //查看图片详情
        [self showPicDetail:url];
        decisionHandler(WKNavigationActionPolicyCancel);
        return;
    }
    decisionHandler(WKNavigationActionPolicyAllow);
}

showPicDetail:() 方法打开浮窗:

objectivec 复制代码
-(void) showPicDetail:(NSString *)imgUrl{
    ShowBigPicDetailViewController *vc = [[ShowBigPicDetailViewController alloc] init];
    vc.imageUrl = imageUrl;
    //设置全屏显示   关键语句,必须有
    vc.modalPresentationStyle = UIModalPresentationOverCurrentContext;
    [self presentViewController:vc animated:YES completion:nil];
}

设置UIViewController2 背景半透明

objectivec 复制代码
- (void)viewDidLoad {
    [super viewDidLoad];
    //设置半透明背景
    [self.view setBackgroundColor:[UIColor colorWithRed:0 green:0 blue:0 alpha:0.5f]];
    ...
}

关闭浮窗弹窗:

objectivec 复制代码
[self dismissViewControllerAnimated:YES completion:nil];
相关推荐
芦苇Z3 小时前
HTML <a> 标签的 rel 属性全解析:安全、隐私与 SEO 最佳实践
前端·html
法的空间5 小时前
Flutter JsonToDart 支持 JsonSchema
android·flutter·ios
2501_915918416 小时前
iOS 上架全流程指南 iOS 应用发布步骤、App Store 上架流程、uni-app 打包上传 ipa 与审核实战经验分享
android·ios·小程序·uni-app·cocoa·iphone·webview
Alice-YUE6 小时前
【CSS学习笔记3】css特性
前端·css·笔记·html
00后程序员张8 小时前
iOS App 混淆与加固对比 源码混淆与ipa文件混淆的区别、iOS代码保护与应用安全场景最佳实践
android·安全·ios·小程序·uni-app·iphone·webview
Magnetic_h16 小时前
【iOS】设计模式复习
笔记·学习·ios·设计模式·objective-c·cocoa
破无差17 小时前
《赛事报名系统小程序》
小程序·html·uniapp
00后程序员张18 小时前
详细解析苹果iOS应用上架到App Store的完整步骤与指南
android·ios·小程序·https·uni-app·iphone·webview
前端小超超18 小时前
capacitor配置ios应用图标不同尺寸
ios·蓝桥杯·cocoa
2501_9151063220 小时前
Xcode 上传 ipa 全流程详解 App Store 上架流程、uni-app 生成 ipa 文件上传与审核指南
android·macos·ios·小程序·uni-app·iphone·xcode