UITableViewCell indentation centering imageView? - iphone

Does anyone know of any reason why indentation of a UITableViewCell would center the cell's UIImageView horizontally? In theory (and judging by the screenshots and apps I've seen in the past), the imageView should always align to the right, keeping a consistent space to the two labels. In my case (screenshot below), it doesn't. This is a default UITableViewCell with the UITableViewCellStyleSubtitlestyle. Any clues? I've been looking at this for quite a while and can't seem to figure it out.
Update: apparently UITableViewCellStyleDefault doesn't have this issue - imageView's are right-aligned with the (single) label. Why there is a difference between the two styles is beyond me.
(green/blue areas added to illustrate the issue)

How UITableViewCell draws its contentView is not how you would normally draw subviews in an UIView. It does not modify frame property of imageView, textLabel and detailLabel. I guess it gets those views graphic references and dealing with custom drawing.
Which means, there is no control. Unfortunately I also have to say you need some customizations. But it would be enough just to have a custom content view, not to subclass the whole table view cell class.

Related

tvOS UIImageView Focus Shadow Clipped

I have a UICollectionViewCell in a UICollectionView containing two components
1 x UIImageView
1 x UIView
The UIView would ideally contain a couple of labels, and has the following properties set as default:
backgroundColor = .clear
isHidden = true
The UICollectionView has clipsToBounds set to false.
In the delegate of the UICollectionView, I am using the didUpdateFocusIn function to determine which cell will receive focus next, and un-hide the UIView.
As the UIImageView has the adjustsImageWhenAncestorFocused set to true, there is a drop-shadow drawn by tvOS when it automatically applies the zoom + parallex effect.
As can be see in the two pictures below (the second picture has the UIView's backgroundColor set to .black for clarity), the shadow is clipped by the empty space belonging to the UIView in the cell beside it, even though the UIView is already hidden.
Is there some way that I can resolve this?
Edit: Have added a third image which shows the shadow behaving perfectly when the UIView is totally removed from the .xib.
Well, it turns out that I'm a bumbling fool.
I forgot that I had set the bottom constraint of the UIImageView to be anchored to the top of the UIView that was below it.
The net result of hiding the UIView caused the UIImageView to seek out the bottom of the UICollectionViewCell, and that caused the clipping issues.
I have now constrained the UIImageView to a fixed height, and the problem has been resolved!
Since tvOS 11, there is no need to bind your view constraints to the UIImageView constraints to get that effect.
You can get that effect making use of the new property overlayContentView of UIImageView.
Link to the documentation:
https://developer.apple.com/documentation/uikit/uiimageview/2882128-overlaycontentview
A more elaborated explanation can be found from the minute 15:00 of the following WWDC video:
https://developer.apple.com/videos/play/wwdc2017/209/
If the method offered by Apple to get this effect, is not enough for your specific case, I also recommend this great third party library which basically allows getting a Parallax effect in any UIView.
https://github.com/PGSSoft/ParallaxView

UITableCell Centered with Shadow

I would like to build my UITableView in similar way to Google+ app, which has:
UITableCell width of about 310 I guess but the important thing is they centered, I dont know how to achieve that...
There is a 1-2 pixels of shadow beneath the cell.
Please help me to understand how to position my cells the same way and how to add the shadow effect.
Thanks.
UITableCell width of about 310 I guess but the important thing is they centered, I dont know how to achieve that... : You'll have to create a own subclass of UITableViewCell. Here you can position the controls which you need however you need. You can achieve the above shown UITableView only by creating your custom UITableViewCell. You can refer this
There is a 1-2 pixels of shadow beneath the cell. : This can be possible only by using the image with shadow as a background of your customized UITableViewCell.
OK so I finally got the solution.
I used a background image for each cell that takes the whole width (I kind of cheated) and incorporate the shadow and the 10px separation in the background image.
Of course I had to use Photoshop or similar program to achieve that. so the UITableView and the Cell width should be 320, and the height of the cell should contain the shadow and the separation as well.
This is how I make the table to look exactly like I want it to be!!

How to set UITextView's content inset like Notes App

I am working in an app in which I need to give feature like Notes App in iphone. as shown in first screen shot , initially , notes leaves a tab before the content starts, I also wanted to do the same and for that when I set Left Content inset (of UITextView) by 25 , it shows like in screenshot 2, here you may see the image also gets shifted. I have set image as background. I don't know how to solve this problem.
I also tried by adding image as subview of UITextview but it won't repeat the lines, while scrolling (image of lines) like notes app.
I'm setting the background of Textview by following code.
[textView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"line_image.png"]]];
Please tell me if I am going wrong or any extra effort needed to get desired output.
Thanks
UITextView is UIScrollView subclass so all relevant delegate method are available for you (e.g. scrollViewDidScroll:) - you can adjust your custom background in that method.
There's very nice post on Dr.Touch blog about recreating Notes app interface - you can get general idea about how it is done from it. Basically what is done there is adding custom view that draws background behind the text view and adjust it in text view's delegate methods and also using KVO on its 'contentSize' property.
#Dinesh gave nice solution but it doesn't sound to be generic as I want to use image of lines instead of drawing them. Image has some special effects that can not be achieved by drawing. So to solve it I created a table view below the textview keeping textview's background transparent. Now just added the image of line to my tableview's custom cell and set content offset of UItableview same as of the scrollview (subview of text view ,refering to the answer of #Vladimir ) .
And used the following code to scroll my tableview with scrolling the textview and got the desired output.
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
tableView.contentOffset =scrollView.contentOffset;
}
Keeping my tableview's number of rows at a very large number.
PS: instead of setting the content inset of textview, i set its frame's X position and decreased the width relaively.

Unable to add oversized button in UIToolbar

I have a UIToolbar in IB with a custom UIBarButtonItem that is set to an image. The image height is larger than the UIToolbar height. The image does not load for some reason. Attached is a screenshot.
You should avoid using subviews that are larger than the parent view - even if it does work and draws the view outside of the bounds, you cannot always count on it because the clipping is skipped for performance reasons and depending on the drawing order the overlapping part of the subview might be covered later. Second problem is that only the part within the frame of the superview is able to handle the touch events.
As to why you don't see your image, it's probably a different problem, I doubt it has something to do with it going outside the frame. Post your code to get more feedback ;)

UITextView text is pixelated when loaded from my XIB file

Ok, I've got a XIB class called MenuItemView with 3 sub views, a UIImage, a UILabel, and a UITextView.
I'm dynamically loading instances of MenuItemView as pages in a UIScrollView. It creates a similar effect of scrolling through food items in the Chipotle app.
My problem is, the text in both the UILabel and UITextView are becoming very pixelated when loading the views.
Has anyone run into this before? Is there something I'm just overlooking here?
Are you using the shouldRasterize option on the layer of the label/textview? I was doing this awhile back and it seems to mess up the contents of UILabels and TextViews
Can you post a screenshot somewhere to better explain what you mean by "pixelated" here? If what you mean is "blurry" then the most common cause of that is drawing on fractional pixels, which can happen if you do things like center the text without rounding/truncating the result to a whole pixel.
If you really mean pixelated (where oversized pixels are visible), then I would suspect that you are scaling a font inappropriately. This could happen if you apply a scaling transform to the view, or in some cases if you mess with the bounds.