線上教育平臺開發中,作業功能中的圖片上傳是如何實現的

萬嶽教育系統發表於2020-08-14

目前,很多線上教育平臺中,為了驗證課堂的教學效果或學員學習情況,一般都內建了作業系統。學員在上傳作業的過程中,有可能會上傳多張圖片並按序(自下而上)排列,那麼這個功能是如何實現的呢?下面小編就以iOS版本的 線上教育平臺開發 為例,來說明下,如何使用 WKWebView來實現圖片排列。

一、先建立一個wkwebview

- (WKWebView *)wkWebV{
    if (!_wkWebV) {
        _wkWebV = [[WKWebView alloc]initWithFrame:CGRectMake(0, 0, _window_width, _window_height)];
    }
    return _wkWebV;
}


二、 建立一個獲取圖片陣列

- (void)getImageData{
//圖片連結陣列,這裡隨便找了幾張圖片
    NSArray *array = @[@“https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1688444226,912774195&fm=26&gp=0.jpg",@"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1597380686451&di=9c0c95578967f990f80df47815f75403&imgtype=0&src=http%3A%2F%2F01.minipic.eastday.com%2F20161212%2F20161212144027_cded4c83f17c47604eb2be0530bb43ba_7.jpeg"];
    NSString *htmlStr = @“";
//遍歷圖片陣列,新增img標籤
    for (NSString *str in array) {
        NSString *ssss = [NSString stringWithFormat:@"<img src='%@'></img>",str];
        htmlStr = [NSString stringWithFormat:@"%@%@",htmlStr,ssss];
    }
//設定CSS
    NSString * htmlStyle = @" <style type=\"text/css\"> *{min-width: 100% !important;max-width: 100% !important;} img{ height: auto !important;}  </style> “;
//把CSS和img標籤拼接
    htmlStr = [htmlStyle stringByAppendingString:htmlStr];
//使用WKWebview載入HTMLSting
    [_wkWebV loadHTMLString:htmlStr baseURL:nil];
}


以上就是 線上教育平臺開發 中, 如何使用 WKWebView來實現 作業功能中的 圖片排列 效果


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69968464/viewspace-2711776/,如需轉載,請註明出處,否則將追究法律責任。

相關文章