ytpm
ytpm

Reputation: 5150

UITableViewCell image alignment to the right, possible?

when adding an image to table cell, as default it goes to left:

cell.imageView.image = [UIImage imageNamed:[arrImages objectAtIndex:indexPath.row]];

how can I change it that every image in the UITableViewCell will go automaticlly to the right and the textLabel will be 10px to the left of the image.

Thanks alot!

Upvotes: 5

Views: 13361

Answers (6)

Mohsen mokhtari
Mohsen mokhtari

Reputation: 3062

in swift3 and swift4, we can use this:

cell.accessoryView = UIImageView(image:UIImage(named:"imageNmae")!)

Upvotes: 1

abi
abi

Reputation: 819

Found a better answer from @TomSwift here https://stackoverflow.com/a/31616694/1884707

cell.contentView.transform = CGAffineTransformMakeScale(-1,1);
cell.imageView.transform = CGAffineTransformMakeScale(-1,1);
cell.textLabel.transform = CGAffineTransformMakeScale(-1,1);
cell.textLabel.textAlignment = NSTextAlignmentRight;

By applying a transform on the contentView you can place the imageView on the right.

Upvotes: 1

Lorenzo B
Lorenzo B

Reputation: 33428

Another way is to create a custom cell and override layoutSubviews method.

@interface CustomCell : UITableViewCell

@end

@implementation CustomCell

- (void)layoutSubviews
{
   [super layoutSubviews];

   // grab bound for contentView
   CGRect contentViewBound = self.contentView.bounds;
   // grab the frame for the imageView
   CGRect imageViewFrame = self.imageView.frame;
   // change x position
   imageViewFrame.origin.x = contentViewBound.size.width - imageViewFrame.size.width;
   // assign the new frame
   self.imageView.frame = imageViewFrame;
}

@end

Rembember that in cellForRowAtIndexPath you need to create and reuse CustomCell and not UITableViewCell.

Hope it helps.

Edit

#import "CustomCell.h"

// other code here...

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"CustomCell";
    CustomCell *cell = (CustomCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil)
    {
        cell = [[[CustomCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
    }

    return cell;
}

Upvotes: 10

Narasimha Nallamsetty
Narasimha Nallamsetty

Reputation: 1263

Find the solution here code.

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"foo.png"]];
cell.accessoryView = imageView;

For your reference.

UITableViewCell with image on the right?

Upvotes: 5

paul.lander
paul.lander

Reputation: 458

One solution is to use a custom UITableViewCell. The steps are:

  1. Create a new objective-C class that is a subclass of UITableViewCell, for example LabeledImageTableViewCell. Declare ivars and properties for a UILabel and a UIImageView.
  2. In Interface Builder, set the content of the UITableView to Dynamic Prototypes. Drag a UIImageView and a UILabel to a table view cell and position them. Set the cell's class to LabeledImageTableViewCell. Connect the outlets of the cell to the UILabel & UIImageView objects of LabeledImageTableViewCell.
  3. In the delegate for UITableView (usually a UITableViewController, sometimes a UIViewController) implement the datasource methods, for example:

    //#pragma mark - Table view data source
    - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
    {
        return 1;
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
    {
        return (NSInteger)[rowData count];
    }
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
    {
        static NSString *CellIdentifier = @"tvcLabeledImage";
        LabeledImageTableViewCell *cell = (LabeledImageTableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
        if (cell == nil) {
            cell = [[LNCCorrelationInfoTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
        }
        cell.myImage = [UIImage imageNamed:@"imageForThisRow.png"];
        cell.myLabel = "imageForThisRow";
        return cell;
    }
    

Also, check out the Apple videos from WWDC 2011, UITableView Changes, Tips & Tricks and Introducing Interface Builder Storyboarding (Login required: https://developer.apple.com/videos/wwdc/2011/.)

Upvotes: 0

meronix
meronix

Reputation: 6176

try this:

cell.imageView.frame = CGRectMake(cell.frame.size.width - cell.imageView.frame.size.width, cell.imageView.frame.origin.y, cell.imageView.frame.size.width, cell.imageView.frame.size.height);
[cell.yourTexLabel sizeToFit];
cell.yourTexLabel.frame = CGRectMake(cell.imageView.origin.x - cell.yourTexLabel.frame.size.width - 10, cell.yourTexLabel.frame.origin.y, cell.yourTexLabel.frame.size.width, cell.yourTexLabel.frame.size.height);

Upvotes: 1

Related Questions