All Products
Search
Document Center

Item component

Last Updated: May 25, 2021
  • AUListItem is a series of controls designed based on the new UED requirements. It cannot be used interchangeably with the APTableView control in the original APCommonUI because most UED styles are different.
  • AUListItem contains four ListItems. The following table lists the elements supported by them respectively.
AUListItem Title Subtitle Left icon Right icon Left icon in a customized size Show a checkmark
when selected
Rightmost assistant arrow
AUSingleTitleListItem YES️ YES YES️ YES YES️ YES YES️
AUDoubleTitleListItem YES️ YES YES️ YES️ YES️
AUCheckBoxListItem YES️ —️ —️ YES️
AUSwitchListItem YES️ —️ —️ —️

Sample images

  • AUSingleTitleListItem

  • AUDoubleTitleListItem

  • AUCheckBoxListItem

  • AUSwitchListItem

Dependency

The dependency of AUListItem is as follows:

 
  1. import <UIKit/UIKit.h>

API description

Common APIs

Model layer

Multiple delegates are set to standardize parameter transfer by external clients. For elements that are not supported, external clients cannot transfer the corresponding parameters. For example, AUDoubleTitleListItem does not support the right icon. Therefore, AUDoubleTitleListItemModelDelegate does not contain the rightImage parameter.

 
  1. AUListItemProtocols.h
  2. /**
  3. Data items that can be set and accessed in AUSingleTitleListItem.
  4. */
  5. @protocol AUSingleTitleListItemModelDelegate <NSObject>
  6. @property (nonatomic, copy) NSString *subtitle; // The subtitle.
  7. @property (nonatomic, strong) UIImage *leftImage; // The left-side image.
  8. @property (nonatomic, strong) UIImage *rightImage; // The image before the text on the right side.
  9. @property (nonatomic, strong) UIImage *rightAssistImage; // The image after the text on the right side.
  10. @property (nonatomic, assign) CGSize leftimageSize; // You can set the size of the left-side image. Default size: 22.
  11. @property (nonatomic, assign) CGSize rightAssistImageSize; // You can set the size of the image after the text on the right side. Default size: 22.
  12. @end
  13. /**
  14. Data items that can be set and accessed in AUDoubleTitleListItem.
  15. */
  16. @protocol AUDoubleTitleListItemModelDelegate <NSObject>
  17. @property (nonatomic, copy) NSString *subtitle; // The subtitle.
  18. @property (nonatomic, strong) UIImage *leftImage; // The left-side image.
  19. @property (nonatomic, assign) CGSize leftimageSize; // You can set the size of the left-side image. The default size is used if you do not set this parameter.
  20. @property (nonatomic, copy) NSString *timeString; // The time displayed on the right side.
  21. @property (nonatomic, copy) NSString *rightAssistString; // The auxiliary information on the right side, which is centered by default.
  22. @property (nonatomic, assign) NSInteger subtitleLines; // The number of auxiliary subtitle lines, which must be specified by the client.
  23. //@property (nonatomic, assign) BOOL showAccessory; // Whether to display the auxiliary icon.
  24. @end
  25. /**
  26. Data items that can be set and accessed in AUCheckBoxListItem.
  27. */
  28. @protocol AUCheckBoxListItemModelDelegate <NSObject>
  29. //@property (nonatomic, assign) BOOL showAccessory; // Whether to display the auxiliary icon.
  30. @end
  31. /**
  32. Data items that can be set and accessed in AUMultiListItemDelagate.
  33. */
  34. @protocol AUMultiListItemDelagate <NSObject>
  35. @property (nonatomic, copy) NSString *subtitle; // The subtitle.
  36. @property (nonatomic, strong) UIImage *leftImage; // The left-side image.
  37. //@property (nonatomic, assign) CGSize leftimageSize; // The size of the left-side image.
  38. @property (nonatomic, assign) BOOL showAccessory; // Whether to display the auxiliary icon.
  39. @property (nonatomic, assign) NSInteger subtitleLines; // Set the number of subtitle lines.
  40. @end
  41. /**
  42. Data items that can be set and accessed in AUMultiListBottomAssistDelagate.
  43. */
  44. @protocol AUMultiListBottomAssistDelagate <NSObject>
  45. @property (nonatomic, strong) NSString *originalText; // The source of the text.
  46. @property (nonatomic, strong) NSString *timeDesc; // The time description.
  47. @property (nonatomic, strong) NSString *othersDesc; // Other description.
  48. @end
  49. /**
  50. Data items that can be set and accessed in AUParallelTitleListItem.
  51. */
  52. @protocol AUParallelTitleListItemModelDelegate <NSObject>
  53. @property (nonatomic, copy) NSString *subtitle; // Title 2
  54. @property (nonatomic, copy) NSString *describe; // Description 1
  55. @property (nonatomic, copy) NSString *subDescribe; // Description 2
  56. @end
  57. /**
  58. Data items that can be set and accessed in AULineBreakListItem.
  59. */
  60. @protocol AULineBreakListItemModelDelegate <NSObject>
  61. @property (nonatomic, copy) NSString *subtitle; // The subtitle.
  62. @end
  63. /**
  64. Data items that can be set and accessed in AUCouponsItemDelagate.
  65. */
  66. @protocol AUCouponsItemDelagate <NSObject>
  67. @property (nonatomic, copy) NSString *subtitle; // The subtitle.
  68. @property (nonatomic, strong) UIImage *leftImage; // The left-side image.
  69. @property (nonatomic, strong) UIImage *leftImageUrl; // The URL of the left-side image.
  70. @property (nonatomic, strong) NSString *assistDesc; // The text assisted description.
  71. @property (nonatomic, assign) NSInteger totalWidth; // Set the width of the card.
  72. @end
  73. /**
  74. The rich text protocol of TTTAttributeLabelDelagate.
  75. */
  76. @protocol TTTAttributeLabelDelagate <NSObject>
  77. @property (nonatomic, copy) NSString *attributeText; // The rich-text content.
  78. @property (nonatomic, copy) NSString *linkText; // The rich-text link text.
  79. @property (nonatomic, copy) NSString *linkURL; // The URL of the rich-text content.
  80. @end
  81. AUListItemModel.h
  82. import "AUListItemProtocols.h"
  83. @interface AUListItemModel : NSObject
  84. @property (nonatomic, copy) NSString *title; // The title.
  85. @property (nonatomic, assign) UIEdgeInsets separatorLineInset; // You can set the margin between the left-side and right-side separation lines and the cell.
  86. @end

View layer

 
  1. AUBaseListItem.h:
  2. @interface AUBaseListItem : UITableViewCell
  3. // The following data items are open so that external clients can set extra properties, such as the title color.
  4. @property(nonatomic,strong) UILabel *titleLabel;
  5. @property(nonatomic,strong) UIView *separatorLine;
  6. /**
  7. The initialization function.
  8. @param reuseIdentifier The reuse identifier.
  9. @param block The block imported externally. Generally, title and leftimage are set in this block externally.
  10. @return Return a self instance.
  11. */
  12. - (instancetype)initWithReuseIdentifier:(NSString *)reuseIdentifier model:(void(^)(AUListItemModel*model))block;
  13. /**
  14. Return the cell height.
  15. @return Return the cell height.
  16. */
  17. + (CGFloat)cellHeight ;
  18. @end
  19. #ifdef AUBaseListItem_protected
  20. // This identifier is open only to the subclass. Before importing AUBaseListItem in the subclass, set AUBaseListItem_protected to 1.
  21. @interface AUBaseListItem ()
  22. @property (nonatomic,strong) AUListItemModel* baseModel;
  23. @end
  24. #endif
  25. /**
  26. Generally, a client simply needs to call the initWithReuseIdentifier:model: method in the AUBaseListItem subclass to meet the requirement.
  27. Here, independent methods oriented to parameters such as title are provided.
  28. All parameters, except title, are implemented in the subclass and isolated from each other.
  29. */
  30. @interface AUBaseListItem (Extensions)
  31. /**
  32. Set the title.
  33. @param title The title string.
  34. */
  35. - (void)setTitle:(NSString* )title;
  36. /**
  37. The method for getting the title.
  38. @return Return the title string.
  39. */
  40. - (NSString*)title ;
  41. /**
  42. Set the spacing between the separation line and the left or right side of a cell.
  43. @param separatorLineInset UIEdgeInsets parameter
  44. */
  45. - (void)setSeparatorLineInset:(UIEdgeInsets)separatorLineInset;
  46. /**
  47. Get the inset of the separation line.
  48. @return Return the inset of the separation line.
  49. */
  50. - (UIEdgeInsets)separatorLineInset;

AUSingleTitleListItem

 
  1. typedef NS_ENUM(NSInteger, AUSingleTitleListItemStyle) {
  2. AUSingleTitleListItemStyleDefault, // Height: 92; icon: 58.
  3. AUSingleTitleListItemStyleValue1, // Height: 110; icon: 72.
  4. };
  5. @interface AUSingleTitleListItem : AUBaseListItem
  6. @property(nonatomic,strong) UILabel *subtitleLabel;
  7. @property(nonatomic,strong) UIImageView *leftImageView;
  8. @property(nonatomic,strong) UIImageView *rightImageView;
  9. @property(nonatomic,strong) UIImageView *rightAssistImageView;
  10. /**Important
  11. The initialization function.
  12. @param reuseIdentifier The reuse identifier.
  13. @param block The block imported externally. Generally, title and leftimage are set in this block externally.
  14. @return Return a self instance.
  15. */
  16. - (instancetype)initWithReuseIdentifier:(NSString*)reuseIdentifier model:(void(^)(AUListItemModel<AUSingleTitleListItemModelDelegate>*model))block __deprecated_msg("Do not use this method because it will be discarded.");
  17. /**
  18. Set all data required for showing a cell.
  19. @param block The block to be transferred.
  20. */
  21. - (void)setModelBlock:(void(^)(AUListItemModel<AUSingleTitleListItemModelDelegate>*model))block;
  22. /**
  23. The initialization function.
  24. @param reuseIdentifier The reuse identifier.
  25. @param style The custom style. For more information, see AUSingleTitleListItemStyle.
  26. @return Return a self instance.
  27. */
  28. - (instancetype)initWithReuseIdentifier:(NSString*)reuseIdentifier customStyle:(AUSingleTitleListItemStyle)style;
  29. /**
  30. Return a height based on the style.
  31. @param style
  32. @return Return a custom style. For more information, see AUSingleTitleListItemStyle.
  33. */
  34. + (CGFloat)cellHeightForStyle:(AUSingleTitleListItemStyle)style;
  35. @end

AUDoubleTitleListItem

 
  1. typedef NS_ENUM(NSInteger, AUDoubleTitleListItemStyle) {
  2. AUDoubleTitleListItemStyleDefault, // Has a left icon; height: 120 px; icon: 76.
  3. AUDoubleTitleListItemStyleValue1, // Has no left icon; height: 120 px.
  4. AUDoubleTitleListItemStyleValue2, // Has a left icon; height: 144 px; icon: 88.
  5. };
  6. @interface AUDoubleTitleListItem : AUBaseListItem<AUDoubleTitleListItemModelDelegate, TTTAttributeLabelDelagate>
  7. @property(nonatomic,strong) UILabel *subtitleLabel;
  8. @property(nonatomic,strong) UIImageView *leftImageView;
  9. @property(nonatomic,strong) UILabel* timeLabel;
  10. @property(nonatomic,strong) UILabel *rightAssistLabel;
  11. /**
  12. Set all data required for showing a cell.
  13. @param block The block to be transferred.
  14. */
  15. - (void)setModelBlock:(void(^)(AUListItemModel<AUDoubleTitleListItemModelDelegate, TTTAttributeLabelDelagate>*model))block;
  16. /**
  17. The initialization function.
  18. @param reuseIdentifier The reuse identifier.
  19. @param style The custom style. For more information, see AUDoubleTitleListItemStyle.
  20. @return Return a self instance.
  21. */
  22. - (instancetype)initWithReuseIdentifier:(NSString*)reuseIdentifier customStyle:(AUDoubleTitleListItemStyle)style;
  23. /**
  24. Return a height aaccording to the style.
  25. @param style The custom style. For more information, see AUDoubleTitleListItemStyle.
  26. @return Return the cell height.
  27. */
  28. + (CGFloat)cellHeightForStyle:(AUDoubleTitleListItemStyle)style;
  29. /**
  30. Return a dynamic height according to the style.
  31. @param style The custom style. For more information, see AUDoubleTitleListItemStyle.
  32. @param block The data model. For more information, see AUDoubleTitleListItemModelDelegate.
  33. Note: 1. The method must transfer a exact value of model.accessoryType.
  34. 2. If line feeds are required, use subtitleLines to specify the number of lines.
  35. @return Return the cell height.
  36. */
  37. + (CGFloat)cellHeightForStyle:(AUDoubleTitleListItemStyle)style
  38. modelBlock:(void(^)(AUListItemModel<AUDoubleTitleListItemModelDelegate, TTTAttributeLabelDelagate>*model))block;
  39. @end

AUCheckBoxListItem

 
  1. @protocol AUCheckBoxListItemDelegate <NSObject>
  2. /**
  3. The callback to be triggered when the check box status changes.
  4. @param item The check box instance.
  5. */
  6. - (void)checkboxValueDidChanged:(AUCheckBox *)item;// Take the tag of the cell as the tag of the item.
  7. @end
  8. @interface AUCheckBoxListItem : AUBaseListItem<AUCheckBoxListItemModelDelegate>
  9. @property(nonatomic, assign, getter = isChecked) BOOL checked;// Set the check box to the selected state.
  10. @property(nonatomic, assign, getter = isDisableCheck) BOOL disableCheck;// Specify whether to disable the check box.
  11. @property(nonatomic, weak) id <AUCheckBoxListItemDelegate> delegate;
  12. @end

AUSwitchListItem

 
  1. @interface AUSwitchListItem : AUNBaseListItem
  2. @property (nonatomic,strong) UISwitch *switchControl; // The switch control in a cell.
  3. // Specify whether to show or hide the loading icon.
  4. - (void)showLoadingIndicator:(BOOL)show;
  5. @end

Custom properties

Property Purpose Type
title The title. NSString
titleLabel The title label. UILabel
subtitle The subtitle. NSString
subtitleLabel The subtitle label. UILabel
leftImage The left-side icon. UIImage
leftImageView The view of the left-side icon. UIImageView
rightImage The right-side icon. UIImage
rightImageView The view of the right-side icon. UIImageView
leftimageSize The size of the left-side icon. CGSize
timeString The time string on the right. NSString
timeLabel The time label on the right. UILabel
showMarkWhenSelected Whether to show a checkmark for a selected cell. BOOL
showAccessory Whether to show an assistant icon. BOOL
checked Whether AUCheckBoxListItem is selected. BOOL
disableCheck Whether AUCheckBoxListItem is disabled. BOOL
Note:The following code sample shows the properties supported in each control.

Sample code

AUSingleTitleListItem

  • The recommended usage is as follows.
 
  1. AUSingleTitleListItem*cell = [[AUSingleTitleListItem alloc] initWithReuseIdentifier:identifierSingle1 model:^(AUListItemModel<AUSingleTitleListItemModelDelegate> *model) {
  2. model.title = @"Title";
  3. model.subtitle = @"Subtitle";
  4. model.showAccessory = YES;
  5. model.XXX = XXXX;
  6. // The supported properties are contained in AUListItemModel and AUSingleTitleListItemDelegate. For more information, see their API descriptions.
  7. }];
  • You can also set the provided properties separately. The property names are the same as those in model in the preceding recommended usage.
 
  1. AUSingleTitleListItem*cell = [[AUSingleTitleListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testsingle"];
  2. cell.title = @"Subtitle";
  • Each element on the control can be set.
 
  1. AUSingleTitleListItem*cell = [[AUSingleTitleListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testsingle"];
  2. cell.titleLabel.backgroundColor = [UIColor redColor];

AUDoubleTitleListItem

  • The recommended usage is as follows.
 
  1. AUDoubleTitleListItem*cell = [[AUDoubleTitleListItem alloc] initWithReuseIdentifier:identifierDouble3 model:^(AUListItemModel<AUDoubleTitleListItemModelDelegate> *model) {
  2. model.title = @"Right icon not supported";
  3. model.leftImage = [UIImage imageNamed:@"AntUI.bundle/ilustration_ap_expection_limit.png"];
  4. model.leftimageSize = CGSizeMake(100, 100);
  5. model.showAccessory = YES;
  6. // The supported properties are contained in AUListItemModel and AUSingleTitleListItemDelegate. For more information, see their API descriptions.
  7. }];
  • You can also set provided properties separately.
 
  1. AUDoubleTitleListItem*cell = [[AUDoubleTitleListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testdouble"];
  2. cell.leftImage = [UIImage imageNamed:@"AntUI.bundle/ilustration_ap_expection_limit.png"];
  • Each element on the control can be set.
 
  1. AUDoubleTitleListItem*cell = [[AUDoubleTitleListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testdouble"];
  2. cell.leftImageView.image = [UIImage imageNamed:@"AntUI.bundle/ilustration_ap_expection_limit.png"];

AUCheckBoxListItem

  • The recommended usage is as follows.
 
  1. AUCheckBoxListItem* cell = [[AUCheckBoxListItem alloc] initWithReuseIdentifier:identifierChecbkox model:^(AUListItemModel<AUCheckBoxListItemModelDelegate> *model) {
  2. model.title = @"Selected by default";
  3. model.showAccessory = NO;
  4. // Only the preceding two properties can be set.
  5. }];
  6. cell.disableCheck = YES;// Set the check button to the disabled state.
  • You can also set provided properties separately.
 
  1. AUCheckBoxListItem*cell = [[AUCheckBoxListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testcheck"];
  2. cell.showAccessory =YES;
  • Each element on the control can be set.
 
  1. AUCheckBoxListItem*cell = [[AUDoubleTitleListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"testcheck"];
  2. cell.titleLabel.text = @"Selected by default";

AUSwitchListItem

 
  1. AUSwitchListItem *switchCell = [[AUSwitchListItem alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"switchCell"];
  2. AUListItemModel *model = _datas[indexPath.row];
  3. switchCell.titleLabel.text = model.title;
  4. switchCell.leftAccessorView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"certify.png"]];
  5. switchCell.leftAccessorType = AUListItemLeftAccessorTypeIcon;
  6. switchCell.switchControl.on = NO;
  7. UISwitch *switchView = (UISwitch *)switchCell.accessoryView;
  8. [switchView addTarget:self action:@selector(switchValueDidChanged:) forControlEvents:UIControlEventValueChanged];
  9. return switchCell;