2020-11-30

在iOS14系统中,YBImageBrowser 3.0.9版本未进行适配导致图片显示黑屏。问题源于YYAnimatedImageView在iOS14的displayLayer方法处理不当。解决方法是重写YYAnimatedImageView.m的displayLayer方法,确保在iOS14下正确设置contentsScale和contents属性。

iOS14   YBImageBrowser   黑屏

YBImageBrowser的pod最新版本为3.0.9!该版本没有对iOS14进行适配

在 iOS14 下显示不出图片,黑屏状态!

出现原因:iOS 14系统调用方法- (void)displayLayer:(CALayer *)layer

YYAnimatedImageView 没有正确处理

解决方法:重写YYAnimatedImageView.m 的中的displayLayer方法

- (void)displayLayer:(CALayer *)layer {
 
UIImage *currentFrame = _curFrame;
 
if (!currentFrame) {
 
        currentFrame = self.image;
 
    }
 
if (currentFrame) {
 
        layer.contentsScale = currentFrame.scale;
 
        layer.contents = (__bridge id)currentFrame.CGImage;
 
    }
 
}

 

<think> 我们只需要调整显示样式,使得日期在视觉上呈现出递增的效果(比如颜色渐变、字体大小渐变等),而不是修改日期的值。 根据用户描述,日期值已经存在,且按行递增(第一行是2020-10-11,第二行是2020-11-11,第三行是2020-12-11,以此类推)。 因此,我们只需要为每一行的日期单元格设置不同的样式,例如: - 颜色从浅到深(表示时间由远及近) - 字体大小由小变大(表示时间由远及近) 这样,用户一眼就能看出日期的递增趋势。 我们将使用jQuery遍历每一行,然后根据行号(索引)来动态设置样式。 注意:日期已经存在,我们不需要修改值,只需要修改显示样式。 具体实现: 1. 遍历表格的每一行(跳过表头)。 2. 对于每一行,获取它在所有数据行中的序号(从0开始)。 3. 计算该行的样式(颜色、字体大小等),序号越大(即越往下),颜色越深,字体越大。 4. 将计算出的样式应用到该行的日期单元格上。 我们将为两个日期列(第4列和第5列)设置样式,但也可以根据需求调整。 下面是一个完整的实现代码: </think> ### 解决方案:实现日期值的视觉递增效果 根据您的需求(日期值已存在且按时间递增排列,只需增强视觉呈现效果),以下是优化后的实现方案: ```html <style> /* 日期递增视觉增强样式 */ .date-column { transition: all 0.3s ease; } /* 时间越近的日期视觉越突出 */ .recent-date { font-weight: bold; box-shadow: 0 2px 5px rgba(0,0,0,0.1); background-color: #f8f9fa; } </style> <script> $(document).ready(function() { // 获取日期列中的所有日期值 const dateValues = []; $("#table_border_id tr:gt(0)").each(function() { dateValues.push($(this).children().eq(3).find('input').val()); }); // 为日期列应用视觉递增效果 $("#table_border_id tr:gt(0)").each(function(i) { const dateCell = $(this).children().eq(3).addClass('date-column'); const dateValue = dateValues[i]; // 计算视觉权重(日期越新权重越高) const date = new Date(dateValue); const maxDate = new Date(Math.max(...dateValues.map(d => new Date(d)))); const minDate = new Date(Math.min(...dateValues.map(d => new Date(d)))); // 计算时间比例(0-1范围) const timeRatio = (date - minDate) / (maxDate - minDate); // 应用视觉增强效果 dateCell.css({ 'font-size': `${14 + timeRatio * 6}px`, // 字体大小递增 'color': `hsl(214, ${70 + timeRatio * 30}%, ${40 - timeRatio * 15}%)`, // 颜色渐变 'border-left': `4px solid hsl(214, ${70 + timeRatio * 30}%, 50%)`, 'padding': '8px 12px', 'background': `linear-gradient(to right, rgba(0,123,255,${0.1 * timeRatio}), white)` }); // 为最近日期添加特殊标识 if (date.getTime() === maxDate.getTime()) { dateCell.addClass('recent-date'); } }); }); </script> ``` ### 实现原理: 1. **日期值采集**: ```javascript const dateValues = []; $("#table_border_id tr:gt(0)").each(function() { dateValues.push($(this).children().eq(3).find('input').val()); }); ``` - 收集所有日期值用于计算时间范围 2. **时间比例计算**: ```javascript const timeRatio = (date - minDate) / (maxDate - minDate); ``` - 计算当前日期在时间范围内的位置比例(0=最早日期,1=最新日期) 3. **动态视觉增强**: - **字体大小**:`14 + timeRatio * 6px`(最新日期比最早大6px) - **颜色渐变**:使用HSL色彩空间实现平滑过渡 - **边框标识**:左侧色条随日期趋新而加深 - **背景渐变**:最新日期有更明显的蓝色高亮 4. **最近日期突出**: ```javascript if (date.getTime() === maxDate.getTime()) { dateCell.addClass('recent-date'); } ``` - 为最新日期添加特殊样式(加粗、阴影等) ### 视觉呈现效果示例: | 日期值 | 视觉特征 | |--------------|-----------------------------| | 2020-10-11 | 小字体,浅蓝色,弱边框 | | 2020-11-11 | 中等字体,中蓝色,中等边框 | | 2020-12-11 | 大字体,深蓝色,粗边框 | | ... | ... | | (最新日期) | 最大字体+加粗+阴影+高亮背景 | ### 自定义选项: 1. 调整颜色方案:修改HSL参数中的色相值(214为蓝色) 2. 改变尺寸范围:调整`14 + timeRatio * 6`中的基础值和增量 3. 增强最近日期样式:修改`.recent-date`类定义
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值