iOS: done #1156 (story titles height)

Replaced the Preview descriptions preference with a multi-select for title only, plus short, medium, and long title & content. The text space is dynamically distributed between the two. The thumbnail is constrained in size so both the large and small variations work with all preview text sizes, with the date below if it fits.
samuelclay · Jan 30, 2019 · 1077ddc · 1077ddc
1 parent 087032e
commit 1077ddc
Show file tree

Hide file tree

Showing 6 changed files with 120 additions and 48 deletions.
diff --git a/clients/ios/Classes/FeedDetailTableCell.h b/clients/ios/Classes/FeedDetailTableCell.h
@@ -10,6 +10,14 @@
 #import "NewsBlurAppDelegate.h"
 #import "NBSwipeableCell.h"
 
+typedef NS_ENUM(NSUInteger, FeedDetailTextSize)
+{
+    FeedDetailTextSizeTitleOnly = 0,
+    FeedDetailTextSizeShort,
+    FeedDetailTextSizeMedium,
+    FeedDetailTextSizeLong
+};
+
 @interface FeedDetailTableCell : NBSwipeableCell {
     NewsBlurAppDelegate *appDelegate;
 
@@ -64,6 +72,8 @@
 @property (readwrite) BOOL hasAlpha;
 @property (readwrite) BOOL inDashboard;
 
+@property (nonatomic) FeedDetailTextSize textSize;
+
 - (void)setupGestures;
 
 @end
@@ -76,4 +86,4 @@
 @property (nonatomic) FeedDetailTableCell *cell;
 @property (nonatomic) UIImage *storyImage;
 
-@end
+@end
diff --git a/clients/ios/Classes/FeedDetailTableCell.m b/clients/ios/Classes/FeedDetailTableCell.m
@@ -37,7 +37,7 @@ @implementation FeedDetailTableCell
 @synthesize isRead;
 @synthesize isShared;
 @synthesize isSaved;
-@synthesize isShort;
+@synthesize textSize;
 @synthesize isRiverOrSocial;
 @synthesize feedColorBar;
 @synthesize feedColorBarTopBorder;
@@ -198,9 +198,12 @@ - (void)drawRect:(CGRect)r {
         BOOL isSmall = [preview isEqualToString:@"small"];
         CGFloat previewOffset = isSmall ? 60 : 0;
         CGFloat previewMargin = isSmall ? 10 : 0;
+        CGFloat maxSize = isSmall ? 64 : 128;
+        CGFloat imageSize = MIN(r.size.height - previewOffset, maxSize);
+        CGFloat topMargin = isSmall ? 14 + riverPadding : 0;
 
-        CGRect imageFrame = CGRectMake(r.size.width - r.size.height + previewOffset - previewMargin, (previewOffset / 2.0) + 1.0,
-                                       r.size.height - previewOffset, r.size.height - previewOffset);
+        CGRect imageFrame = CGRectMake(r.size.width - imageSize - previewMargin, topMargin,
+                                       imageSize, imageSize);
         UIImageView *storyImageView = [[UIImageView alloc] initWithFrame:imageFrame];
 
         UIImage *cachedImage = (UIImage *)[appDelegate.cachedStoryImages objectForKey:cell.storyImageUrl];
@@ -218,7 +221,9 @@ - (void)drawRect:(CGRect)r {
             [storyImageView.image drawInRect:imageFrame blendMode:0 alpha:alpha];
             rect.size.width -= imageFrame.size.width;
 
-            if (!isSmall) {
+            BOOL isRoomForDateBelowImage = CGRectGetMaxY(imageFrame) < r.size.height - 10;
+
+            if (!isSmall && !isRoomForDateBelowImage) {
                 dateRect = rect;
             }
         }
@@ -276,14 +281,20 @@ - (void)drawRect:(CGRect)r {
     if (cell.highlighted || cell.selected) {
         textColor = UIColorFromLightDarkRGB(0x686868, 0xA0A0A0);
     }
+    CGFloat boundingRows = cell.isShort ? 1.5 : 3;
+    if (!cell.isShort && (self.cell.textSize == FeedDetailTextSizeMedium || self.cell.textSize == FeedDetailTextSizeLong)) {
+        boundingRows = 5;
+    }
     CGSize theSize = [cell.storyTitle
-                      boundingRectWithSize:CGSizeMake(rect.size.width, cell.isShort ? font.pointSize*1.5 : font.pointSize*3)
+                      boundingRectWithSize:CGSizeMake(rect.size.width, font.pointSize * boundingRows)
                       options:NSStringDrawingTruncatesLastVisibleLine|NSStringDrawingUsesLineFragmentOrigin
                       attributes:@{NSFontAttributeName: font,
                                    NSParagraphStyleAttributeName: paragraphStyle}
                       context:nil].size;
-
-    int storyTitleY = 14 + riverPadding + ((font.pointSize*2 - theSize.height)/2);
+    NSUInteger titleRows = theSize.height / font.pointSize;
+    BOOL needsCentering = theSize.height < font.pointSize * 2;
+    int centeringOffset = needsCentering ? ((font.pointSize * 2 - theSize.height) / 2) : 0;
+    int storyTitleY = 14 + riverPadding + centeringOffset;
     if (cell.isShort) {
         storyTitleY = 14 + riverPadding - (theSize.height/font.pointSize*2);
     }
@@ -312,15 +323,21 @@ - (void)drawRect:(CGRect)r {
         if (cell.inDashboard) {
             storyContentWidth -= leftMargin*2;
         }
+        CGFloat boundingRows = cell.isShort ? 1.5 : 3;
+        if (!cell.isShort && self.cell.textSize == FeedDetailTextSizeMedium) {
+            boundingRows = 6 - titleRows;
+        } else if (!cell.isShort && self.cell.textSize == FeedDetailTextSizeLong) {
+            boundingRows = 8 - titleRows;
+        }
+
         CGSize contentSize = [cell.storyContent
-                              boundingRectWithSize:CGSizeMake(storyContentWidth,
-                                                              cell.isShort ? font.pointSize*1.5 : font.pointSize*3)
+                              boundingRectWithSize:CGSizeMake(storyContentWidth, font.pointSize * boundingRows)
                               options:NSStringDrawingTruncatesLastVisibleLine|NSStringDrawingUsesLineFragmentOrigin
                               attributes:@{NSFontAttributeName: font,
                                            NSParagraphStyleAttributeName: paragraphStyle}
                               context:nil].size;
-
-        int storyContentY = r.size.height - 16 - 4 - ((font.pointSize*2 + font.lineHeight) + contentSize.height)/2;
+        CGFloat textRows = contentSize.height / font.pointSize;
+        int storyContentY = r.size.height - 16 - 4 - ((font.pointSize * textRows + font.lineHeight) + contentSize.height) / 2;
         if (cell.isShort) {
             storyContentY = r.size.height - 10 - 4 - ((font.pointSize + font.lineHeight) + contentSize.height)/2;
         }
@@ -398,7 +415,7 @@ - (void)drawRect:(CGRect)r {
 
     paragraphStyle.alignment = NSTextAlignmentLeft;
     [cell.storyAuthor
-     drawInRect:CGRectMake(leftMargin, storyAuthorDateY, rect.size.width - dateSize.width - 12, 15.0)
+     drawInRect:CGRectMake(leftMargin, storyAuthorDateY, dateRect.size.width - dateSize.width - 12, 15.0)
      withAttributes:@{NSFontAttributeName: font,
                       NSForegroundColorAttributeName: textColor,
                       NSParagraphStyleAttributeName: paragraphStyle}];

diff --git a/clients/ios/Classes/FeedDetailViewController.h b/clients/ios/Classes/FeedDetailViewController.h
@@ -12,9 +12,9 @@
 #import "Utilities.h"
 #import "NBNotifier.h"
 #import "MCSwipeTableViewCell.h"
+#import "FeedDetailTableCell.h"
 
 @class NewsBlurAppDelegate;
-@class FeedDetailTableCell;
 @class MCSwipeTableViewCell;
 
 @interface FeedDetailViewController : BaseViewController 
@@ -60,7 +60,7 @@
 @property (nonatomic, readwrite) BOOL isOnline;
 @property (nonatomic, readwrite) BOOL isShowingFetching;
 @property (nonatomic, readwrite) BOOL isDashboardModule;
-@property (nonatomic, readwrite) BOOL showContentPreview;
+@property (nonatomic) FeedDetailTextSize textSize;
 @property (nonatomic, readwrite) BOOL showImagePreview;
 @property (nonatomic, readwrite) BOOL invalidateFontCache;
 

diff --git a/clients/ios/Classes/FeedDetailViewController.m b/clients/ios/Classes/FeedDetailViewController.m
@@ -64,7 +64,6 @@ @implementation FeedDetailViewController
 @synthesize isShowingFetching;
 @synthesize isDashboardModule;
 @synthesize storiesCollection;
-@synthesize showContentPreview;
 @synthesize showImagePreview;
 @synthesize invalidateFontCache;
 
@@ -276,9 +275,24 @@ - (void)preferredContentSizeChanged:(NSNotification *)aNotification {
     [self.storyTitlesTable reloadData];
 }
 
+- (void)updateTextSize {
+    NSUserDefaults *userPreferences = [NSUserDefaults standardUserDefaults];
+    NSString *textSizePref = [userPreferences stringForKey:@"story_list_preview_text_size"];
+
+    if ([textSizePref isEqualToString:@"short"]) {
+        self.textSize = FeedDetailTextSizeShort;
+    } else if ([textSizePref isEqualToString:@"medium"]) {
+        self.textSize = FeedDetailTextSizeMedium;
+    } else if ([textSizePref isEqualToString:@"long"]) {
+        self.textSize = FeedDetailTextSizeLong;
+    } else {
+        self.textSize = FeedDetailTextSizeTitleOnly;
+    }
+}
+
 - (void)reloadData {
     NSUserDefaults *userPreferences = [NSUserDefaults standardUserDefaults];
-    self.showContentPreview = [userPreferences boolForKey:@"story_list_preview_description"];
+
     self.showImagePreview = ![[userPreferences stringForKey:@"story_list_preview_images_size"] isEqualToString:@"none"];
 
     appDelegate.fontDescriptorTitleSize = nil;
@@ -313,8 +327,9 @@ - (void)viewWillAppear:(BOOL)animated {
     [MBProgressHUD hideHUDForView:self.view animated:NO];
     self.messageView.hidden = YES;
 
+    [self updateTextSize];
+
     NSUserDefaults *userPreferences = [NSUserDefaults standardUserDefaults];
-    self.showContentPreview = [userPreferences boolForKey:@"story_list_preview_description"];
     self.showImagePreview = ![[userPreferences stringForKey:@"story_list_preview_images_size"] isEqualToString:@"none"];
 
     // set right avatar title image
@@ -1460,7 +1475,7 @@ - (UITableViewCell *)tableView:(UITableView *)tableView
     }
 
     cell.storyContent = nil;
-    if (self.isDashboardModule || self.showContentPreview) {
+    if (self.isDashboardModule || self.textSize != FeedDetailTextSizeTitleOnly) {
         cell.storyContent = [[[story objectForKey:@"story_content"] convertHTML] stringByDecodingXMLEntities];
     }
 
@@ -1496,8 +1511,9 @@ - (UITableViewCell *)tableView:(UITableView *)tableView
 
     cell.isRead = ![storiesCollection isStoryUnread:story];
     cell.isReadAvailable = ![storiesCollection.activeFolder isEqualToString:@"saved_stories"];
-
+    cell.textSize = self.textSize;
     cell.isShort = NO;
+
     UIInterfaceOrientation orientation = [UIApplication sharedApplication].statusBarOrientation;
     if (!self.isPhoneOrCompact &&
         !self.isDashboardModule &&
@@ -1662,44 +1678,45 @@ - (CGFloat)tableView:(UITableView *)tableView
             return CGRectGetHeight(self.view.frame) - 40;
         }
         return 120;
-    } else if (storiesCollection.isRiverView ||
-               storiesCollection.isSavedView ||
-               storiesCollection.isReadView ||
-               storiesCollection.isSocialView ||
-               storiesCollection.isSocialRiverView) {
-        NSInteger height = kTableViewRiverRowHeight;
-        if ([self isShortTitles]) {
-            height = height - kTableViewShortRowDifference;
-        }
-        UIFontDescriptor *fontDescriptor = [self fontDescriptorUsingPreferredSize:UIFontTextStyleCaption1];
-        UIFont *font = [UIFont fontWithDescriptor:fontDescriptor size:0.0];
-        if ([self isShortTitles] && self.showContentPreview) {
-            return height + font.pointSize*3.25;
-        } else if (self.isDashboardModule || self.showContentPreview) {
-            return height + font.pointSize*5;
-        } else {
-            return height + font.pointSize*2;
-        }
     } else {
         NSInteger height = kTableViewRowHeight;
+        if (storiesCollection.isRiverView ||
+            storiesCollection.isSavedView ||
+            storiesCollection.isReadView ||
+            storiesCollection.isSocialView ||
+            storiesCollection.isSocialRiverView) {
+            height = kTableViewRiverRowHeight;
+        }
         if ([self isShortTitles]) {
             height = height - kTableViewShortRowDifference;
         }
         UIFontDescriptor *fontDescriptor = [self fontDescriptorUsingPreferredSize:UIFontTextStyleCaption1];
         UIFont *font = [UIFont fontWithDescriptor:fontDescriptor size:0.0];
-        if ([self isShortTitles] && self.showContentPreview) {
+        if ([self isShortTitles] && self.textSize != FeedDetailTextSizeTitleOnly) {
             return height + font.pointSize*3.25;
-        } else if (self.isDashboardModule || self.showContentPreview) {
-            return height + font.pointSize*5;
+        } else if (self.isDashboardModule || self.textSize != FeedDetailTextSizeTitleOnly) {
+            switch (self.textSize) {
+                case FeedDetailTextSizeLong:
+                    return height + font.pointSize*9;
+                    break;
+                case FeedDetailTextSizeMedium:
+                    return height + font.pointSize*7;
+                    break;
+                default:
+                    return height + font.pointSize*5;
+                    break;
+            }
         } else {
             return height + font.pointSize*2;
         }
     }
 }
+
 - (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {
     // This will create a "invisible" footer
     return 0.01f;
 }
+
 - (void)scrollViewDidScroll: (UIScrollView *)scroll {
     [self checkScroll];
 }

diff --git a/clients/ios/Resources/Settings.bundle/Root.plist b/clients/ios/Resources/Settings.bundle/Root.plist
@@ -154,13 +154,27 @@
 		</dict>
 		<dict>
 			<key>Type</key>
-			<string>PSToggleSwitchSpecifier</string>
+			<string>PSMultiValueSpecifier</string>
 			<key>Title</key>
-			<string>Preview descriptions</string>
+			<string>Preview</string>
+			<key>Titles</key>
+			<array>
+				<string>Title only</string>
+				<string>Short title and content</string>
+				<string>Medium title and content</string>
+				<string>Long title and content</string>
+			</array>
 			<key>Key</key>
-			<string>story_list_preview_description</string>
+			<string>story_list_preview_text_size</string>
 			<key>DefaultValue</key>
-			<true/>
+			<string>short</string>
+			<key>Values</key>
+			<array>
+				<string>title</string>
+				<string>short</string>
+				<string>medium</string>
+				<string>long</string>
+			</array>
 		</dict>
 		<dict>
 			<key>Type</key>

diff --git a/clients/ios/Resources/Settings.bundle/Root~ipad.plist b/clients/ios/Resources/Settings.bundle/Root~ipad.plist
@@ -174,13 +174,27 @@
 		</dict>
 		<dict>
 			<key>Type</key>
-			<string>PSToggleSwitchSpecifier</string>
+			<string>PSMultiValueSpecifier</string>
 			<key>Title</key>
 			<string>Preview descriptions</string>
+			<key>Values</key>
+			<array>
+				<string>title</string>
+				<string>short</string>
+				<string>medium</string>
+				<string>long</string>
+			</array>
+			<key>Titles</key>
+			<array>
+				<string>Title only</string>
+				<string>Short title and content</string>
+				<string>Medium title and content</string>
+				<string>Long title and content</string>
+			</array>
 			<key>Key</key>
-			<string>story_list_preview_description</string>
+			<string>story_list_preview_text_size</string>
 			<key>DefaultValue</key>
-			<true/>
+			<string>short</string>
 		</dict>
 		<dict>
 			<key>Type</key>