Category Archives: C/C++/Objective-C

Why use Virtual (C++)

January 24, 2018C/C++/Objective-Cadmin

ref – https://stackoverflow.com/questions/2391679/why-do-we-need-virtual-functions-in-c?rq=1

Simple Over-riding

Without “virtual” you get “early binding”. Which implementation of the method is used gets
decided at compile time based on the type of the pointer that you call through.

#include <iostream>

using namespace std;

// Without "virtual" you get "early binding".

// Which implementation of the method is used gets

// decided at compile time based on

// "the type of the pointer that you call through".

class Shape {

public:

Shape() {

cout << "\nConstructing Shape" << endl;

}

// NO VIRTUAL. just a base function to be over-ridden

void draw() {

cout << "\n SHAPE: Draw function" << endl;

}

};

class Circle : public Shape {

private:

float mRadius;

public:

Circle(float newRadius) {

cout << "\nConstructing Circle" << endl;

this->mRadius = newRadius;

}

void draw() {

cout << "\n Circle: draw function" << endl;

}

};

// due to the parameter of func being Shape *,

// without virtual, we get early binding. At compile time,

// it is decided that Shape will be used. And thus,

// any objects that derives from Shape passed int, will literally

// use Shape as the implementation. All draw() are called upon the

// Shape implementation.

void func(Shape * s) {

s->draw();

}

int main(int argc, const char * argv[]) {

Circle * myCircle = new Circle(6.8);

Shape * myShape = new Shape();

func(myShape);

func(myCircle);

delete myCircle;

delete myShape;

return 0;

}

OUTPUT:

Constructing Shape
Constructing Circle

Constructing Shape

SHAPE: Draw function
SHAPE: Draw function

Using Virtual

#include <iostream>

using namespace std;

// With "virtual" you get "late binding".

// Which implementation of the method is used gets decided

// at run time based on the type of the pointed-to object -

// what it was originally constructed as. This is not necessarily

// what you'd think based on the type of the pointer that points to that object.

class Shape {

public:

Shape() {

cout << "\nConstructing Shape" << endl;

}

// virtual functions resolved at runtime

virtual void draw() {

cout << "\n SHAPE: Draw function" << endl;

}

};

class Circle : public Shape {

private:

float mRadius;

public:

Circle(float newRadius) {

cout << "\nConstructing Circle" << endl;

this->mRadius = newRadius;

}

void draw() {

cout << "\n Circle: draw function" << endl;

}

};

void func(Shape * s) {

s->draw();

}

int main(int argc, const char * argv[]) {

Circle * myCircle = new Circle(6.8);

Shape * myShape = new Shape();

func(myShape);

func(myCircle);

delete myCircle;

delete myShape;

return 0;

}

OUTPUT:

Constructing Shape
Constructing Circle

Constructing Shape

SHAPE: Draw function
Circle: draw function

Pointing delegate to where the delegate implementation is

July 31, 2017C/C++/Objective-Cadmin

Most of the time, the delegate implementation is at the current source file where the delegate and its owning object is created.

But sometimes its not.

For example, say we have a UIView called caliGuestView. We want to set up a popover control in that class.

There is a custom made popover control like so:

1	@interface Popover : UIView

Due to subclassed UIView, we know to drag a UIView component into the xib, then put Popover in its custom class tab. Thus we now have the custom made control in our xib. Once that’s done, we ctrl drag it into our source file and its ready to go.

CaliGuestView.swift

1	@IBOutlet weak var aDropDown: Popover!

CaliGuestView.swift

Initially we think, ok, we get the delegate to point here in the CaliGuestView class. Then we implement the delegate methods in this class.
BUT! what if we have delegate functionality implemented elsewhere (like MyCustomCell.m). How do we get the delegate to point where the implementation is?

1) DO NOT ASSIGN the delegate here (in CailGuestView). Simply initialize it as is.

CaliGuestView.swift

aDropDown.isUserInteractionEnabled = true

let itemsArray = // some array of strings

aDropDown.items = itemsArray

aDropDown.picker.reloadAllComponents()

2) make sure MyCustomCell’s delegate implementation is set

MyCustomCell.m

@interface MyCustomCell : UITableViewCell <DropDownDelegate>

...

- (void)shouldDisplayPopover:(PopoverDropDown *)popover selectedItemDidChange:(id)item toIndex:(NSUInteger)index {

}

- (void)shouldHidePopover:(PopoverDropDown *)popover {

}

- (void)popoverDropView:(PopoverDropDown *)view selectedItemDidChange:(id)item toIndex:(NSUInteger)index{

}

3) let MyCustomCell’s instance of this class point to self

MyCustomCell owns the CaliGuestView, and thus can simply access its delegate. Then point that delegate to self.

MyCustomCell.m

if ([item isEqualToString:@"haha"]) {

caliGuestView.stateDropDown.delegate = self;

}

Table within a table

July 24, 2017C/C++/Objective-Cadmin

table within a table

UITableViewDataSource’s cellForRowAtIndexPath

For a certain row, use your custom cell that has the tableview.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

if(indexPath.row != 0) {

NSLog(@"%s", __FUNCTION__);

UITableViewCell *cell = (UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"tvcItems"];

if(cell==nil) {

NSLog(@"%s - Creating new cell for index %lu", __FUNCTION__, indexPath.row);

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault

reuseIdentifier: @"tvcItems"];

}

[cell.textLabel setText:[self.myData objectAtIndex:[indexPath row]]];

return cell;

}

else { // for row 0, we create another table inside the cell

NSLog(@"%s - Creating MyTableViewCell for cell # %lu", __FUNCTION__, indexPath.row);

static NSString *cellIdentifier = @"HistoryCell";

// Similar to UITableViewCell, but

MyTableViewCell *cell = (MyTableViewCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier];

if (cell == nil) {

cell = [[MyTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];

}

// Just want to test, so I hardcode the data

//cell.descriptionLabel.text = @"Testing";

return cell;

}

UITableViewDelegate’s heightForRowAtIndexPath

Make sure your table view delegate method heightForRowAtIndexPath is appropriate so people can see your custom cell.

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

if(indexPath.row==0) {

return 300.0f;

} else {

return 86.0f;

The cell that contains the inner table

Create your tableview with its associated data array, then add it to the cell’s view hierarchy.

#import "MyTableViewCell.h"

@implementation MyTableViewCell

@synthesize dataArray; //array to hold submenu data

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier

{

self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];

if (self) {

[self setBackgroundColor:[UIColor orangeColor]];

self.frame = CGRectMake(0.0f, 20.0f, self.bounds.size.width, 300.0f);

self.dataArray = [[NSMutableArray alloc] initWithObjects:@"Inner Table - One", nil];

UITableView * subMenuTableView = [[UITableView alloc]initWithFrame:CGRectMake(0.0f, 20.0f, self.bounds.size.width, 280.0f)

style:UITableViewStylePlain]; //create tableview a

subMenuTableView.tag = 100;

subMenuTableView.delegate = self;

subMenuTableView.dataSource = self;

subMenuTableView.alwaysBounceVertical = NO;

[self addSubview:subMenuTableView]; // add it cell

...

}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

{

return 1;

}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

return dataArray.count;

}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellID"];

if(cell == nil)

{

cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cellID"];

}

cell.textLabel.text = [self.dataArray objectAtIndex:indexPath.row];

return cell;

}

...

Table row animation

July 24, 2017C/C++/Objective-Cadmin

Assuming you have basic table with data set up, this is how you do row animations on it.

To remove a row from the end

-(void) removeButtonClicked:(UIButton*)sender {

NSLog(@"you clicked on button %@", sender.titleLabel.text);

UITableView * subMenu = (UITableView*)[self viewWithTag:100];

[self.dataArray removeLastObject];

[subMenu deleteRowsAtIndexPaths:@[[NSIndexPath indexPathForRow:self.dataArray.count inSection:0]]

withRowAnimation:UITableViewRowAnimationTop];

}

To add a row to the end

-(void) addButtonClicked:(UIButton*)sender

{

NSLog(@"you clicked on button %@", sender.titleLabel.text);

[self.dataArray addObject:[NSString stringWithFormat:@"%lu", self.dataArray.count + 1]];

UITableView * subMenu = (UITableView*)[self viewWithTag:100];

//append row

[subMenu insertRowsAtIndexPaths:@[[NSIndexPath indexPathForRow:self.dataArray.count - 1 inSection:0]]

withRowAnimation:UITableViewRowAnimationTop];

}

To reload all sections in a table

-(void) reloadButtonClicked: (UIButton*)sender {

// no animation

NSLog(@"you clicked on button %@", sender.titleLabel.text);

UITableView * subTableView = (UITableView*)[self viewWithTag:100];

for (int i = 0; i < self.dataArray.count; ++i) {

// Select a random element between i and end of array to swap with.

int Elements = (int)self.dataArray.count - i;

int n = (arc4random() % Elements) + i;

[self.dataArray exchangeObjectAtIndex:i withObjectAtIndex:n];

}

NSIndexSet *sections = [NSIndexSet indexSetWithIndexesInRange:NSMakeRange(0, [subTableView numberOfSections])];

[subTableView reloadSections:sections withRowAnimation:UITableViewRowAnimationFade];

}

Move a row

// move data from the FROM location to the TO location

-(void) moveButtonClicked:(UIButton*)sender {

NSLog(@"you clicked on button %@", sender.titleLabel.text);

UITableView * subMenu = (UITableView*)[self viewWithTag:100];

// get the to location's data at the FROM

id data = [self.dataArray objectAtIndex:0];

// remove the that data

[self.dataArray removeObject:data];

// then insert the data to the TO location

[self.dataArray insertObject:data atIndex:self.dataArray.count];

// then just call the moveRowAtIndexPath

[subMenu moveRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:0]

toIndexPath:[NSIndexPath indexPathForRow:self.dataArray.count-1 inSection:0]];

}

Design pattern in ViewController, delegate, dataSource

July 18, 2017C/C++/Objective-Cadmin

ViewController.h

@interface TestViewController {

}

ViewController.m

The concept of delegate is that we can delegate messages to another object, as long as that object conforms to the delegate.
Once an object conforms to a delegate, it just simply needs to implement the delegate methods and that’s it.

Hence in our example, everything starts at tableView. tableView has 2 delegates:

UITableViewDelegate
UITableViewDataSource

Our ViewController class matches up with the ViewController box in the image. Then notice its 2 delegates coming out of it.

One is called “delegate”.
The other is called “dataSource”.

In code, looks like this:

@interface TestViewController ()

@property (weak, nonatomic, readwrite) IBOutlet UITableView *tableView;

@property (strong, nonatomic) TestDelegate *tableViewDelegate;

@property (strong, nonatomic) TestDataSource *tableViewDataSource;

@end

@implementation TestViewController

...

- (void)viewDidLoad

{

[super viewDidLoad];

self.tableViewDataSource = [[TestDataSource alloc] initWithController:self];

self.tableViewDelegate = [[TestDelegate alloc] initWithController:self];

self.tableView.delegate = self.tableViewDelegate;

self.tableView.dataSource = self.tableViewDataSource;

}

Those delegates must point to objects that conforms to them.
Therefore, we then have object TestDelegate that conforms to UITableViewDelegate, which means it implements UITableViewDelegate’s method(s).
Hence the “delegate” delegate can point to it.

Same thing for UITableViewDataSource’s method(s). Hence the “dataSource” delegate can point to it.

TestDataSource.h

TestDataSource conforms to the UITableViewDataSource,
so that TestViewController’s tableView’s dataSource delegate can point to it.

@interface TestDataSource : NSObject <UITableViewDataSource>

@property (strong, nonatomic, readonly) NSMutableDictionary *items;

@end

In the DataSource object, we have a data structure that represent the data we are going to represent on the table.

Initializing the cell object for data source’s cellForRowAtIndexPath

Naturally, when we implement cellForRowAtIndexPath in the data source, we ask the tableView to dequeue a reusable cell for us. Then simply
configure the cell with an “item” object. The reason for this is that we don’t want to initialize an cell object by using multiple parameters and pass lots of data into it.

// not what we want

TestCell *cell = [self.testController.tableView dequeueReusableCellWithIdentifier:[TestCell cellIdentifier]

forIndexPath:indexPath];

cell.propertyA = "this";

cell.propertyB = 234;

cell.propertyC = "wow";

// cell...

// goes on forever

return cell;

Rather, we create a configureWithItem that takes in an object type called say testItem. This is how we pass large amount of data into the cell.

Hence in your custom cell class, do something like this:

TestCell

@interface TestCell : UITableViewCell {

}

- (void)configureWithItem:(TestCellItem *)item;

@interface JNOneFieldCell () {

}

@property (strong, nonatomic) TestCellItem *item;

@end

- (void)configureWithItem:(TestCellItem *)item {

// this way, you can get all the data from an item object

self.item = item;

}

In your data source object, you have the item objects in a structure array. Using the row index, pluck the items from the array and initialize your cell objects with it.

@interface TestDataSource ()

@property (weak, nonatomic) TestViewController *testNowController;

@property (strong, nonatomic, readwrite) NSMutableDictionary *items;

@end

@implementation TestDataSource

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

TestCell *cell = [self.testController.tableView dequeueReusableCellWithIdentifier:[TestCell cellIdentifier]

forIndexPath:indexPath];

cell.delegate = self.testController;

[cell configureWithItem:self.items[@(indexPath.row)]];

return cell;

}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {

return IHGJNCellsCount;

}

@end

TestDelegate

Say, in your delegate, you need to access the data that is being displayed on your table.

For example, you need to return 0 for the height on index 2’s row depending on index 2’s data.
So how do you get that data?

The concept is to access the tableView’s dataSource. Only the viewController has the reference to the tableView.
Thus that is why we have a reference to the viewController as a property, and initialized it via dependency injection like so:

@interface TestDelegate

@property (weak, nonatomic) TestViewController *joinNowController;

@end

@implementation TestDelegate

- (instancetype)initWithController:(TestViewController *)controller {

self = [super init];

if (self) {

self.joinNowController = controller;

}

return self;

}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

}

@end

Now that you have reference to testNowController, you can then get the data source like this:

1	TestDataSource *dataSource = self.testNowController.tableView.dataSource;

Then all you need to do is access the items array in the dataSource, and you can get the data from the row:

- (id)dataItemForIndexPath:(NSIndexPath *)indexPath

{

TestDataSource *dataSource = self.testNowController.tableView.dataSource;

return [dataSource.items objectForKey:@(indexPath.row)];

}

Make sure your return is id, because the array contains different kind of “item” objects. i.e.

TestAItem
TestBItem
TestCItem

Now you can access the item object for that index. Check for a property in the item. Then return the height accordingly.

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {

TestAItem * testItem = [self p_itemFromDataSourceForIndexPath:indexPath];

if(testItem.isVisible==NO) {

return 0;

} else {

return 60.0f;

}

weak references

June 30, 2017C/C++/Objective-Cadmin

https://softwareengineering.stackexchange.com/questions/229287/what-use-is-a-non-zeroing-weak-reference

weak reference – a reference that DOES NOT affect the reference count. Simply put, a weak reference is a reference (pointer, in Objective-C land) to an object which does not participate in keeping that object alive.

Weak references are useful for things like avoiding retain cycles, but their utility is limited due to their inherent danger. With a plain weak reference in Objective-C, when the target object is destroyed, you’re left with a dangling pointer. (your weak reference points to trash content) If your code tries to use that pointer, it will crash or worse.

Use unsafe__unretained to create non-zeroing weak pointers in order to clarify this:

1	NSObject * __unsafe_unretained unsafeReference;

1	@property (unsafe_unretained) NSObject *unsafeProperty;

An unsafe reference is similar to a weak reference in that it doesn’t keep its related object alive, but it won’t be set to nil if the destination object is deallocated. This means that you’ll be left with a dangling pointer to the memory originally occupied by the now deallocated object, hence the term “unsafe.” Sending a message to a dangling pointer will result in a crash.

Zeroing weak references (weak references are only available in Mac OS X ≥ 10.7 and iOS ≥ 5) eliminate this danger. They work just like a regular unsafe unretained reference, except that when the target object is destroyed, they automatically become nil. At any time you access an object through a zeroing weak reference, you’re guaranteed to either access a valid, live object, or get nil. As long as your code can handle nil, then you’re perfectly safe.

You can just declare any instance variable like so:

1	__weak id _foo;

And it’s automatically a zeroing weak reference.

strong reference – a reference that DOES affect the reference count

Protected: SDWebImage usage

June 19, 2017C/C++/Objective-CSDWebImageadmin

loading and showing images for Tables and Collections in swift

June 13, 2017C/C++/Objective-C, iOSadmin

https://github.com/DigitalLeaves/FlawlessTablesAndCollectionViews

Flawless UICollectionViews and UITableViews

https://medium.com/capital-one-developers/smooth-scrolling-in-uitableview-and-uicollectionview-a012045d77f

Image flashes demo (The problem)
no flashes demo (The solution)

First, some background

tableView:cellForRowAtIndexPath: and collectionView:cellForItemAtIndexPath: are called whenever a new cell has to be displayed

The cells have an NSIndexPath[section-row] to identify its position.
In order to get the NSIndexPath of the cell, use

1	tableView.indexPath(for: UITableViewCell)

There is an array that stores the data to be displayed for the cells.

Cells, unlike data in the array, are re-used for efficiency. Thus, they do not stay in place. When a cell with data is about to be displayed, cells are dequeued ( or allocated when there is no cells ). The table will assign the current IndexPath to it, then set data onto it.

In detail, the cells are kept in a pool where they are dequeued and served as they are needed.
When you ask for a cell with dequeueCellWithReuseIdentifier: a new one is created if and only if there’s no previous created cell that can be served.

Objective C version

In objective C, as you can see, we first ask the pool to return us a cell to use.
If its nil, which means the pool does not have spare ones, we need to allocate and create our own.
Once created, we can start settings it properties, and then return it to the class to be displayed.

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

UITableViewCell *cell =

(UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"tvcItems"];

if(cell==nil) {

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault

reuseIdentifier: @"tvcItems"];

}

[cell.textLabel setText:[self.myData objectAtIndex:[indexPath row]]];

return cell;

}

Swift version

In swift, it combines the re-use or creating a new one in one method call of dequeueReusableCell.

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

// create a new cell if needed or reuse an old one

let cell:UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!

// set the text from the data model

cell.textLabel?.text = self.animals[indexPath.row]

return cell

}

Example

So, let us go ahead and see how it all starts out. When the table or collection view first start out, it sees that the the visible rows needs to be displayed.
First, it looks at the first row at index (section 0, row 0), and that it needs to display that cell.

It goes into delegate method cellForRow and tries to dequeue a cell. Because we are just starting out, our cell pool will be empty. Thus, get a new freshly allocated cell for us to use. We assign its display properties (namely, text, color, etc). In our case we simply assign the text property to something. Say, a string “one”.

It then goes to the second row at index (section 0, row 1) and does the same thing. It will see that the cell pool is empty, and thus creates a new cell. We assign its display properties, and give it a strong “two”.

This applies for the rest of the cells that needs to be drawn on the table. Say if 8 cells are showing, usually table will allocate a few more cells, say 10. Take note that even though cells 9 and 10 are allocated, its indexPath will be nil because it is not shown by the table yet Once they are shown, their indexPath will be assigned an IndexPath.

Scrolling up, reusing those cells

At this point, we have successfully created table view cells, set their properties, and have displayed the data in the table.

The cell pool is still empty because we are currently using all of the cells. In other words, they are on display.

Now, the user uses their finger and swipes up. The whole table scrolls up one page.

At this point, the first row at index (section 0, row 0), disappears off the screen. The cell object representing that row gets queued into the cell pool.
then the second row at index (section 0, row 1), disappears off the screen. It also gets queued into the cell pool…
As each on display cell disappears off screen, they get “re-collected” into the cell pool.

But! As each row disappears, new rows from the bottom appears right!?

We need to make sure they are drawn. So at this point, say, (section 0, row 4) starts to appear and it needs display.

It runs through delegate method cellForRow for (section 0, row 4) and tries to dequeue a cell.

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

...

}

It gets a cell object that (section 0, row 1) was previously using.
(section 0, row 1) have disappeared off screen and is not using its cell anymore. It has returned its cell back to the cell pool.

Take note that when the cell (which was previously used by row 0) is dequeued for (section 0, row 4), the tableView will changes the cell’s indexPath to (0,4). Thus, this signifies that this cell now represents for tableView’s section 0, row 4 now.

1 2	// create a new cell if needed or reuse an old one let cell: UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!

Hence the cell variable we get back is a valid object with our designated IndexPath of (0, 4)

Even though the cell’s IndexPath now is (0,4), its data has not been “cleaned” or “zeroed”, so it has the same configuration it had. In other words, that cell’s property text still has the previous string in it. And thus, as we dequeue that cell object for row 4, we over-write the text property with whatever row 4’s string is.

...

// set the text from the data model

cell.textLabel?.text = self.animals[indexPath.row]

...

Then we properly return the cell object.

Note that the disappearing and appearing of the cells are determined by the TableView or Collection class. It may enqueue a bunch of disappearing cells first into the cell pool, then allow appearing cells to dequeue them. Or they may simply do it one by one.

The Problem

1) When the first cell is loaded, it uses dequeueReusableCellWithIdentifier and gets a fresh cell object with address 0x…ffaabb.

2) It then uses the singleton ImageManager and starts doing a async download operation for image 1.

3) The user then swipes up. This makes the cell go out of display, and thus, the cell objects gets put into the cell pool, with its indexPath assigned to nil.

4) As the first row disappears, the 4th row appears, it uses dequeueReusableCellWithIdentifier cell and gets the cell object 0x…ffaabb from the cell pool. This cell was JUST used by row 1.

5) At this point, image 1 download progresses to 50%.

6) Due to 4) with its cell visible, it starts another async image download operation in singleton ImageManager. Image 4’s download progresses to 10%.

7) With row 4 fully visible, it now has the cell object, and is downlading Image 4.

8) Image 1 finishes downloading.

9) Our closure in the cellForRow method points to the cell 0x…ffaabb. It then assigns cell 0x…ffaabb’s imageView.image to image1.

10) Now, for a split second, the image on row 4 is of image1.

11) Then a second later, image 4 finishes downloading, and thus in the same manager as 9), the closure code from cellForRow assigns 0x…ffaabb’s imageView.image to image 4.

12) Even though row 4 now correctly depicts image4 as intended, steps 9) to 11) creates a flash of of image 1 switching to image 4. The user can see it, depending on how slow the download speed is, and thus, is the problem we’re trying to solve.

Async Operations and when they complete

So, instead of doing instantaneous data assignments, we need to do async operations that may take a few seconds. Then after a certain amount of seconds is over, it comes back and updates our UI.

1) cellForRow hits dequeue cell and gets cell 0x…9aa00

let cell = tableView.dequeueReusableCell(withIdentifier: "LazyLoadTableViewCell", for: indexPath)

print(Unmanaged.passUnretained(cell).toOpaque())

//cell has 0x...9aa00

2) Each row of the table matches up to the index of the URL array that gives us a string URL to download an image. cellForRow’s indexPath provides the index and we use that index to get the url from the data array.

1	let imageURL = images[(indexPath as NSIndexPath).row]

we will be using this imageURL and use the Downloader singleton to download that image

3) The Downloader singleton uses the url and literally downloads the image. When its done, it hits up a closure to update the table UI

ImageManager.sharedInstance.downloadImageFromURL(imageURL) { (success, image) -> Void in

// closure

}

4) This here is the most important part. Once the download is done. It hits a closure. The closure references
the cell (that was dequeued for this table row), and the table IndexPath.

It references the cell because we want to see which indexPath it is representing

1	let aCellIndexPath = (tableView.indexPath(for: cell) as NSIndexPath?)?.row

It references the table IndexPath to know which row index was assigned to this operation.

1	let indexRow = (indexPath as NSIndexPath).row

Code is below:

ImageManager.sharedInstance.downloadImageFromURL(imageURL) { (success, image) -> Void in

if success && image != nil {

let aCellIndexPath = (tableView.indexPath(for: cell) as NSIndexPath?)?.row

guard let cellIndex = aCellIndexPath, aCellIndexPath != nil else {

print("processing Cell's index is nil. RETURNING Ø")

return

}

let indexRow = (indexPath as NSIndexPath).row

if (aCellIndexPath == indexRow) {

imageView.image = image

} else {

print("HO NO! cell dequeued (or allocated) has index [\(cellIndex)], index path is [\(indexRow)], DO NOT MATCH!!!! NO SETTING OF IMAGE")

}

Now in normal circumstances, the cell dequeued for say table row 11 has IndexPath [0, 11]. Table view IndexPath is [0, 11].

The Downloader finishes downloading the image, puts it in cache, and then calls our closure for completion.
It sees that IndexPath of the cell that’s we’re referencing is valid and is [0, 11]. This means as far as the cell is concerned, it is on display for row 11.
(If the IndexPath is nil, it means even though the cell is alive, it is not used by any table rows and not on display yet)

Furthermore, the indexPath of the table is [0, 11]. This means we’re currently processing for that row. Hence, due to:

1) cell’s IndexPath is representing and on display for row 11
2) cellForRow delegate method is called for table row 11

we can safely assign the downloaded image onto this cell.

Start download, cell scrolls off screen, download finishes

Let’s say we’re on row 11 and it starts to download an image.

It gets an URL from data[11]
Uses that URL and starts downloading image 11.

Then all of a sudden, the user scrolls row 11 out of view.

At this point 2 things happen:

1) cell for row 11’s indexPath gets set to nil because it is not on display anymore
2) row 15 appears, and dequeues a cell for usage.

1)

the download for image 11 completes! It runs to the closure. Notice 2 things. The closure references 2 important things:

– the cell that just before represented row 11. Its IndexPath is now nil because it is not only display anymore.
– the index of the cellForRow that is calling this closure (11)

We do a comparison and see that nil != 11, thus we don’t assign image 11 to cell’s imageView.

2)

On the other hand, row 15 appeared and dequeues a cell. It starts downloading the image, the image finishes and hits the closure. The closure references 2 things:

– the cell with IndexPath [0, 15] because it is visible
– the index of the cellForRow that is calling this closure (15)

We do a comparison and see that 15 == 15. Thus, we assign the JUST downloaded image for cell with IndexPath [0, 15].

Not visible offscreen cell gets taken by a row that is now visible

There is another situation where when we scroll off screen, the cell for index 11 (0x…ff1000) nows has indexPath of nil.

The downloader for image 11 is going on.

Row 15 appears on screen. It gets dequeued the cell (0x…ff1000) that was previously used by row 11. This is because row 11 disappeared and not using the cell anymore. Then, cellForRow at index 15 starts downloading image 15.

Hence cell 0x…ff1000 now has IndexPath of 15 because it is representing visible row 15.

downloader for image 11 finishes, and runs its closure. It references 0x…ff1000, but wait, the IndexPath for that is now [0, 15]!!
The index of the cellForRow that is calling this closure is 11. Thus, 15 != 11, and we do not assign image 11 to this cell.

image 15 finishes downloading, and runs its closure. It references 0x…ff1000 and the IndexPath for it is [0, 15].
The index of the cellForRow that is calling this closure is 15. Thus 15 == 15 is valid, and it goes ahead and assigns image 15 to
the cell’s imageView.image.

After everything has been downloaded

After everything is downloaded, all images should be instantaneously retrieved from the dictionary cache (url: Image). Once it gets the image, it would use the main queue to update our table.

// in your ImageManager singleton

if let cachedImage = cachedImageForURL(urlString) {

DispatchQueue.main.async(execute: {completion?(true, cachedImage) })

}

In your cellForRowAt, the cellIndex and tableIndex check should succeed much more now because there is no more delay. The image retrieval is instantaneous and then calls the closure right away.

// In your ViewController

ImageManager.sharedInstance.downloadImageFromURL(imageURL) { (success, image) -> Void in

if success && image != nil {

if (aCellIndexPath == indexRow) {

imageView.image = image

}

Separate Delegate and DataSource of UITableView from your ViewController

April 24, 2017C/C++/Objective-Cadmin

Step 1 demo – simple table
step 2 demo – pull out the data source
step 3 demo – pull out table view delegates

Step 1

#import "ViewController.h"

@interface ViewController () <UITableViewDelegate, UITableViewDataSource>

@property(nonatomic,strong) UITableView * tableView;

@property (nonatomic, strong) NSArray * myData;

@end

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

self.myData = [NSArray arrayWithObjects: @"Apple", @"Orange", @"Banana", nil];

self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 480.0f) style:UITableViewStylePlain];

self.tableView.delegate = self;

self.tableView.dataSource = self;

[self.view addSubview:self.tableView];

}

// UITableViewDelegate methods

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

NSLog(@"you have selected row: %lu", indexPath.row);

}

// UITableViewDataSource methods

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

NSLog(@"%s", __FUNCTION__);

UITableViewCell *cell = (UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"tvcItems"];

if(cell==nil) {

NSLog(@"%s - Creating new cell", __FUNCTION__);

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault

reuseIdentifier: @"tvcItems"];

}

[cell.textLabel setText:[self.myData objectAtIndex:[indexPath row]]];

return cell;

}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

{

NSLog(@"%s", __FUNCTION__);

return 1;

}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

NSLog(@"%s", __FUNCTION__);

if(section==0)

return [self.myData count];

else return 0;

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

@end

Step 2 – pulling out the Data Source

In order to declare a data source, we first create an object that houses the data to represent the rows of data in your table view. Declare the protocol of UITableViewDataSource. This is so that your class conforms to it. And other delegates can then safely point to your object.

#import <Foundation/Foundation.h>

#import <UIKit/UIKit.h>

// make sure the protocol is public

@interface MyData : NSObject <UITableViewDataSource>

@end

In the implementation, declare your data container, such as an array of strings.
Initialize your array in the initializer.

Then, in order satisfy the protocol that we conformed to (UITableViewDataSource), make sure you implement its needed methods.
Specifically, we implement

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

#import "MyData.h"

@interface MyData () {

}

@property (nonatomic, strong) NSArray * myData;

@end

@implementation MyData

-(id)init {

if (self=[super init]) {

NSLog(@"%s - initialized", __FUNCTION__);

self.myData = [NSArray arrayWithObjects: @"Apple", @"Orange", @"Banana", nil];

}

return self;

}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

{

NSLog(@"%s", __FUNCTION__);

UITableViewCell *cell = (UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"tvcItems"];

if(cell==nil) {

NSLog(@"%s - Creating new cell", __FUNCTION__);

cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault

reuseIdentifier: @"tvcItems"];

}

[cell.textLabel setText:[self.myData objectAtIndex:[indexPath row]]];

return cell;

}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

{

NSLog(@"%s", __FUNCTION__);

return 1;

}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

{

NSLog(@"%s", __FUNCTION__);

if(section==0)

return [self.myData count];

else return 0;

}

@end

Declare your Data class in ViewController, point dataSource to it

ViewController.m

We now declare our data class (which safely conforms to UITableViewDataSource )as a property.

#import "ViewController.h"

#import "MyData.h"

@interface ViewController () <UITableViewDelegate>

@property(nonatomic,strong) UITableView * tableView;

@property (nonatomic, strong) MyData * dataStore;

@end

Initialize the data object. Then we point the table view’s data source to it.

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 480.0f) style:UITableViewStylePlain];

self.tableView.delegate = self;

self.dataStore = [[MyData alloc] init];

self.tableView.dataSource = self.dataStore;

[self.view addSubview:self.tableView];

}

...

@end

Now if you run it, all UITableViewDelegate delegate messages are sent to your MyData object.

Step 3 – Pulling out the UITableViewDelegate

Now we’re going to create a View object that takes care of all the UITableViewDelegate delegates.

#import <Foundation/Foundation.h>

#import <UIKit/UIKit.h>

@interface MyView : NSObject <UITableViewDelegate>

@end

We implement delegate methods:

1 2	- (void)tableView:(UITableView )tableView didSelectRowAtIndexPath:(NSIndexPath )indexPath - (void)tableView:(UITableView )tableView willDisplayCell:(UITableViewCell )cell forRowAtIndexPath:(NSIndexPath *)indexPath

We log which row is selected.

We also check what kind of cell it is. Then we do something unique according to the cell type.

#import "MyView.h"

#import "MyTableViewCell.h"

@implementation MyView

// UITableViewDelegate methods

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

NSLog(@"%s - you have selected row: %lu", __FUNCTION__, indexPath.row);

}

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {

NSLog(@"%s %ld", __FUNCTION__, (long)indexPath.row);

NSString * classType = [NSString stringWithUTF8String:object_getClassName(cell)];

NSLog(@"%@", classType);

if ([classType caseInsensitiveCompare:@"MyTableViewCell"] == NSOrderedSame) {

MyTableViewCell * temp = (MyTableViewCell*)cell;

temp.descriptionLabel.text = @"This is a custom cell";

} else if ([classType caseInsensitiveCompare:@"UITableViewCell"] == NSOrderedSame) {

cell.backgroundColor = UIColor.cyanColor;

}

@end

Declare your MyView property. It should conform to protocol UITableViewDelegate.

ViewController.m

#import "ViewController.h"

#import "MyData.h"

#import "MyView.h"

@interface ViewController ()

@property(nonatomic,strong) UITableView * tableView;

@property (nonatomic, strong) MyData * dataStore;

@property (nonatomic, strong) MyView * myView;

@end

Then we instantiate it. Make sure your table view’s delegate points to the MyView object. Now all delegates sent from table view for its delegate functionality will be sent to your MyView object to be processed.

Notice that your ViewController is now nice and clean, with a clear separation of concern between data source delegates and tableview delegates.

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 480.0f) style:UITableViewStylePlain];

self.myView = [[MyView alloc] init]; // create the object that conforms to UITableViewDelegate

self.tableView.delegate = self.myView; // assign tableView's delegate to it

self.dataStore = [[MyData alloc] init]; // create the object that conforms to UITableDataSource

self.tableView.dataSource = self.dataStore; // assign tableView's data source to it

[self.view addSubview:self.tableView];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

@end

create table cells using xib

February 28, 2017C/C++/Objective-Cadmin

https://medium.com/@musawiralishah/creating-custom-uitableviewcell-using-nib-xib-files-in-xcode-9bee5824e722#.lbixf1y87

New File > Empty Interface Builder
Then you’ll see the .xib file appear

Click on the “right pane button” to make the Identity Inspector appear, because that’s where all the Interface Builder attributes are.
If the right pane button is not there, go to menu View > Utilities > Identity Inspector.

In the UI components section on the bottom, scroll through all of the UI components that you can drag and drop into the IB. When you get to “Table View Cell”, drag it into the empty space

Then drag a label across, and into the cell.

Create a UITableViewCell source file. In order to connect source file to interface builder, first make sure our cell is selected. Then enter the existing class’s name into the “Custom Class” textfield of the Identity Inspector.

Click on the small arrow button to make sure the xib can detect and navigate to the correct source file. Once that’s done, double click your xib so it opens. Then open up the hierarchy of UI components and you can ctrl+drag the components into the registered source file.

Next, we will create outlets for the text labels in our cell so we can set their values.

You will see the IB outlet in your code like so:

class SearchDisplayNoteTableViewCell: UITableViewCell {

@IBOutlet weak var noteLabel: UILabel!

...

}

to the left of the code, in the region where you put your breakpoints, you’ll see a small circle. If you hover over that circle, you’ll see that the corresponding UI component in IB will light up.

As you can see, both says noteLabel.