优化grid和scroll高度计算，文本的动态属性更新

alibaba · Aug 29, 2024 · 6df8682 · 6df8682
1 parent 6fd8ed5
commit 6df8682
Show file tree

Hide file tree

Showing 4 changed files with 135 additions and 28 deletions.
diff --git a/GaiaXiOS/GaiaXiOS.xcodeproj/xcshareddata/xcschemes/GaiaXiOSTestsNew.xcscheme b/GaiaXiOS/GaiaXiOS.xcodeproj/xcshareddata/xcschemes/GaiaXiOSTestsNew.xcscheme
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
    LastUpgradeVersion = "1540"
-   version = "1.7">
+   version = "1.8">
    <BuildAction
       parallelizeBuildables = "YES"
       buildImplicitDependencies = "YES"

diff --git a/GaiaXiOS/GaiaXiOS/Component/Node/GXGridNode.m b/GaiaXiOS/GaiaXiOS/Component/Node/GXGridNode.m
@@ -36,18 +36,20 @@ @interface GXGridNode () <UICollectionViewDelegate, UICollectionViewDataSource,
     BOOL _hasInit;
     //是否正在展示
     BOOL _isOnShow;
-    //坑位尺寸
-    CGSize _itemSize;
     //是否需要reload
     CGFloat _tmpWidth;
     BOOL _isNeedReload;
     //滚动事件
     GXEvent *_scrollEvent;
+    // 是否同样的高度
+    BOOL _itemSameHeight;
 }
 
 // 数据源
 @property (nonatomic, strong) NSArray *dataArray;
 @property (nonatomic, strong) NSMutableArray *items;
+// 坑位Size数组
+@property (nonatomic, strong) NSArray *sizeValues;
 // 坑位模板的item信息
 @property (nonatomic, strong) GXTemplateItem *subTemplateItem;
 
@@ -247,13 +249,23 @@ - (BOOL)shouldReLayout {
         CGFloat bottomPadding = self.contentInset.bottom;
         //行间距
         CGFloat rowSpace = self.rowSpacing;
-        //itemSize
-        CGSize itemSize = _itemSize;
 
         //计算容器高度
         NSInteger itemCount = self.items.count;
         int totalRow = ceil(((CGFloat)itemCount) / self.column); //行
-        int centerHeiht = totalRow > 0 ? (totalRow * itemSize.height + (totalRow - 1) * rowSpace) : 0;
+        int centerHeiht = 0;
+        if (!_itemSameHeight && self.column == 1) {
+            CGFloat tmpHeight = 0;
+            for (int i = 0; i < self.sizeValues.count; i++) {
+                CGSize size = [[self.sizeValues gx_objectAtIndex:i] CGSizeValue];
+                tmpHeight += size.height;
+            }
+            centerHeiht = totalRow > 0 ? (tmpHeight + (totalRow - 1) * rowSpace) : 0;
+        } else {
+            NSValue *sizeValue = [self.sizeValues firstObject];
+            CGSize itemSize = sizeValue ? [sizeValue CGSizeValue] : CGSizeZero;
+            centerHeiht = totalRow > 0 ? (totalRow * itemSize.height + (totalRow - 1) * rowSpace) : 0;
+        }
         height = topPadding + bottomPadding + centerHeiht;
 
         //更新style
@@ -321,15 +333,44 @@ - (void)processListData:(NSArray *)dataArray{
 
 //计算坑位size
 - (void)calculateItemSize{
+    NSMutableArray *tmpSizeValues = [NSMutableArray array];
     // 获取宽度
     CGFloat extraWidth = self.contentInset.left + self.contentInset.right + (self.column - 1) * self.itemSpacing;
     CGFloat measureWidth = floor(([self currentWidth] - extraWidth) / self.column);
+    CGFloat measureHeight = NAN;
     if (measureWidth <= 0) {
-        _itemSize = CGSizeZero;
+        for (int i = 0; i < self.items.count; i++) {
+            [tmpSizeValues gx_addObject:[NSValue valueWithCGSize:CGSizeZero]];
+        }
+        self.sizeValues = tmpSizeValues;
         return;
     }
     //计算
-    _itemSize = [TheGXTemplateEngine sizeWithTemplateItem:self.subTemplateItem measureSize:CGSizeMake(measureWidth, NAN)];
+    if (self.column == 1 && !_itemSameHeight) { // 列数为1，高度不一致，每个都计算
+        CGSize itemMeasurSize = CGSizeMake(measureWidth, measureHeight);
+        for (int i = 0; i < self.items.count; i++) {
+            CGSize itemSize = CGSizeZero;
+            //获取坑位类型
+            GXTemplateItem *templateItem = self.subTemplateItem;
+            //计算itemSize
+            GXTemplateData *data = [self.items gx_objectAtIndex:i];
+            itemSize = [TheGXTemplateEngine sizeWithTemplateItem:templateItem measureSize:itemMeasurSize data:data];
+            // 过滤，避免宽高为负数
+            CGSize newSize = CGSizeMake(MAX(0, itemSize.width), MAX(0, itemSize.height));
+            //添加到数组中
+            [tmpSizeValues gx_addObject:[NSValue valueWithCGSize:newSize]];
+        }
+    } else {
+        CGSize itemSize = [TheGXTemplateEngine sizeWithTemplateItem:self.subTemplateItem measureSize:CGSizeMake(measureWidth, measureHeight)];
+        // 过滤，避免宽高为负数
+        CGSize newSize = CGSizeMake(MAX(0, itemSize.width), MAX(0, itemSize.height));
+        //添加到数组中
+        for (int i = 0; i < self.items.count; i++) {
+            [tmpSizeValues gx_addObject:[NSValue valueWithCGSize:newSize]];
+        }
+    }
+
+    self.sizeValues = tmpSizeValues;
 }
 
 - (CGFloat)currentWidth{
@@ -381,6 +422,17 @@ - (void)configureViewInfo:(NSDictionary *)viewInfo{
         edgeInsets.right = (CGFloat) padding.right.dimen_value;
     }
     self.contentInset = edgeInsets;
+
+    //获取坑位类型
+    _itemSameHeight = YES;
+    NSDictionary *dataDict = self.data;
+    if ([GXUtils isValidDictionary:dataDict]) {
+        id tmpObjc = [[dataDict gx_dictionaryForKey:@"extend"] objectForKey:@"itemSameHeight"];
+        //计算次数的优化项
+        if (tmpObjc) {
+            _itemSameHeight = [tmpObjc boolValue];
+        }
+    }
 }
 
 //获取坑位类型
@@ -418,16 +470,21 @@ - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSe
 }
 
 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
-    return _itemSize;
+    NSValue *sizeValue = [self.sizeValues gx_objectAtIndex:indexPath.item];
+    CGSize itemSize = sizeValue ? [sizeValue CGSizeValue] : CGSizeZero;
+    return itemSize;
 }
 
 - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(nonnull NSIndexPath *)indexPath {
     //重用标识
     NSString *identifier = self.subTemplateItem.templateId;
     GXGridViewCell *cell = (GXGridViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];
+
+    //获取坑位size
+    NSValue *value = [self.sizeValues gx_objectAtIndex:indexPath.item];
+    CGSize itemSize = [value CGSizeValue];
 
     //获取视图
-    CGSize itemSize = _itemSize;
     GXRootView *rootView = cell.rootView;
     if (!rootView) {
         rootView = (GXRootView *)[TheGXTemplateEngine creatViewByTemplateItem:_subTemplateItem measureSize:itemSize];

diff --git a/GaiaXiOS/GaiaXiOS/Component/Node/GXScrollNode.m b/GaiaXiOS/GaiaXiOS/Component/Node/GXScrollNode.m
@@ -37,6 +37,8 @@ @interface GXScrollNode ()<UICollectionViewDelegate, UICollectionViewDataSource,
     //区分坑位的type & config
     NSDictionary *_config;
     NSString *_expression;
+    //是否每种坑位只计算一次
+    BOOL _itemSameHeight;
 }
 
 //数据源
@@ -337,7 +339,11 @@ - (void)calculateItemSize:(NSDictionary *)extend{
             }
         }
         //计算itemSize
-        itemSize = [TheGXTemplateEngine sizeWithTemplateItem:templateItem measureSize:itemMeasurSize data:data];
+        if (_itemSameHeight) {
+            itemSize = [TheGXTemplateEngine sizeWithTemplateItem:templateItem measureSize:itemMeasurSize];
+        } else {
+            itemSize = [TheGXTemplateEngine sizeWithTemplateItem:templateItem measureSize:itemMeasurSize data:data];
+        }
         //获取高度
         CGFloat itemHeight = itemSize.height;
         if (itemHeight > _containerHeight) {
@@ -557,13 +563,18 @@ - (void)configureViewInfo:(NSDictionary *)viewInfo{
 //获取坑位类型 & 表达式
 - (void)parserItemType{
     NSDictionary *dataDict = self.data;
-    if (dataDict && [dataDict isKindOfClass:[NSDictionary class]]) {
-        NSDictionary *itemType = [[dataDict gx_dictionaryForKey:@"extend"] gx_dictionaryForKey:@"item-type"];
-        if (itemType) {
-            //获取path
-            _expression = [itemType gx_stringForKey:@"path"];
-            //获取config
-            _config = [itemType gx_dictionaryForKey:@"config"];
+    if ([GXUtils isValidDictionary:dataDict]) {
+        NSDictionary *extend = [dataDict gx_dictionaryForKey:@"extend"];
+        if (extend.count > 0) {
+            NSDictionary *itemType = [extend gx_dictionaryForKey:@"item-type"];
+            if (itemType) {
+                //获取path
+                _expression = [itemType gx_stringForKey:@"path"];
+                //获取config
+                _config = [itemType gx_dictionaryForKey:@"config"];
+            }
+            //计算次数的优化项
+            _itemSameHeight = [extend gx_boolForKey:@"itemSameHeight"];
         }
     }
 }

diff --git a/GaiaXiOS/GaiaXiOS/Component/Node/GXTextNode.m b/GaiaXiOS/GaiaXiOS/Component/Node/GXTextNode.m
@@ -295,6 +295,26 @@ - (void)updateNormalStyle:(NSDictionary *)styleInfo isMark:(BOOL)isMark{
         self.textAlignment = [GXUIHelper convertTextAlignment:textAlign];
         paragraphStyle.alignment = self.textAlignment;
     }
+
+    //lineBreakMode  (ellipsis, clip)
+    NSString *textOverflow = [styleInfo gx_stringForKey:@"text-overflow"];
+    if (textOverflow) {
+        self.lineBreakMode = [self parserLineBreakMode:textOverflow];
+        paragraphStyle.lineBreakMode = self.lineBreakMode;
+    }
+
+    //textDecoration
+    NSString *textDecoration = [styleInfo gx_stringForKey:@"text-decoration"];
+    if (textDecoration) {
+        // 重置
+        [self.attributes removeObjectForKey:NSStrikethroughStyleAttributeName];
+        [self.attributes removeObjectForKey:NSUnderlineStyleAttributeName];
+        //删除线 / 下划线
+        self.textDecoration = [self parserTextDecoration:textDecoration];
+        if (self.textDecoration.length) {
+            [self.attributes setObject:@(NSUnderlineStyleSingle) forKey:self.textDecoration];
+        }
+    }
 
     //更新text-color
     NSString *color = [styleInfo gx_stringForKey:@"background-image"] ?: [styleInfo gx_stringForKey:@"color"];
@@ -662,20 +682,14 @@ - (void)configureStyleInfo:(NSDictionary *)styleJson{
 
     //lineBreakMode  (ellipsis, clip)
     NSString *textOverflow = [styleJson gx_stringForKey:@"text-overflow"];
-    if ([textOverflow isEqualToString:@"clip"]) {
-        self.lineBreakMode = NSLineBreakByClipping;
-    } else  if ([textOverflow isEqualToString:@"middle"]) {
-        self.lineBreakMode = NSLineBreakByTruncatingMiddle;
-    } else {
-        self.lineBreakMode = NSLineBreakByTruncatingTail;
+    if (textOverflow) {
+        self.lineBreakMode = [self parserLineBreakMode:textOverflow];
     }
 
     //删除线属性
     NSString *textDecoration = [styleJson gx_stringForKey:@"text-decoration"];
-    if ([textDecoration isEqualToString:@"line-through"]) {
-        self.textDecoration = NSStrikethroughStyleAttributeName;
-    } else if ([textDecoration isEqualToString:@"underline"]) {
-        self.textDecoration = NSUnderlineStyleAttributeName;
+    if (textDecoration) {
+        self.textDecoration = [self parserTextDecoration:textDecoration];
     }
 
     //富文本信息
@@ -737,6 +751,31 @@ - (void)setupTextPadding:(NSDictionary *)styleJSON{
 }
 
 
+//lineBreakMode  (ellipsis, clip)
+- (NSLineBreakMode)parserLineBreakMode:(NSString *)value {
+    NSLineBreakMode lineBreakMode = NSLineBreakByTruncatingTail;
+    if ([value isEqualToString:@"clip"]) {
+        lineBreakMode = NSLineBreakByClipping;
+    } else  if ([value isEqualToString:@"middle"]) {
+        lineBreakMode = NSLineBreakByTruncatingMiddle;
+    } else {
+        lineBreakMode = NSLineBreakByTruncatingTail;
+    }
+    return lineBreakMode;
+}
+
+//删除线属性
+- (NSString *)parserTextDecoration:(NSString *)value {
+    NSString *textDecoration = nil;
+    if ([value isEqualToString:@"line-through"]) {
+        textDecoration = NSStrikethroughStyleAttributeName;
+    } else if ([value isEqualToString:@"underline"]) {
+        textDecoration = NSUnderlineStyleAttributeName;
+    }
+    return textDecoration;
+}
+
+
 #pragma mark - 设置属性
 
 - (void)setFont:(UIFont *)font{