When I apply a rotation transform to a UITextView and then click inside to begin editing, it appears that the content size is automatically being made wider. The new width of the content view is the width of the rotated view's bounding box. For example, given a text box of width 500 and height 400, and rotated by 30 degrees, the new content width would be:
(500 * cos(30)) + (400 * sin(30)) = 633
Or graphically:
Interestingly, if you are already editing the text view and THEN apply the transform, then it appears that no modification is made to the content size. So it appears that sometime around the start of text editing, the text view looks at its frame property and adjusts the content size based on the frame width. I imagine the solution to this is to tell it to use the bounds property instead, however I don't know where to do this, as I'm not sure exactly where the text view is deciding to modify the content size.
I have googled but can't seem to find any references to using transformed UITextViews. Does anybody have any ideas about this?
EDIT (button action from test project):
- (IBAction)rotateButtonTapped:(id)sender {
if (CGAffineTransformIsIdentity(self.textView.transform)) {
self.textView.transform = CGAffineTransformMakeRotation(30.0 * M_PI / 180.0);
}
else {
self.textView.transform = CGAffineTransformIdentity;
}
NSLog(#"contentsize: %.0f, %.0f", textView.contentSize.width, textView.contentSize.height);
}
I was also stuck with this problem.
The only solution which I found was to create an instance of UIView and add the UITextView as a subview. Then you can rotate the instance of UIView and UITextView will work just fine.
UITextView *myTextView = [[UITextView alloc] init];
[myTextView setFrame:CGRectMake(0, 0, 100, 100)];
UIView *myRotateView = [[UIView alloc] init];
[myRotateView setFrame:CGRectMake(20, 20, 100, 100)];
[myRotateView setBackgroundColor:[UIColor clearColor]];
[myRotateView addSubview:myTextView];
myRotateView.transform = CGAffineTransformMakeRotation(0.8);
[[self view] addSubview:myRotateView];
Have you tried applying the rotation by doing a layer transform rather than a transform on the view?
#import <QuartzCore/QuartzCore.h>
mytextField.layer.transform = CATransform3DMakeRotation (angle, 0, 0, 1);
This might be enough to trick whatever broken logic exists inside the core text field code.
Related
For each UIImageView, I want to add the label subview to it.
Here is my class inherited form UIImageView
-(instancetype)initWithFrame:(CGRect)frame
{
if (self=[super initWithFrame:frame]) {
self.categoryLabel=[[UILabel alloc]initWithFrame:CGRectMake(frame.origin.x, frame.origin.y, frame.size.width, 50)];
self.categoryLabel.textAlignment=NSTextAlignmentCenter;
self.categoryLabel.font=[UIFont systemFontOfSize:20];
self.categoryLabel.textColor=[UIColor whiteColor];
[self addSubview:self.categoryLabel];
NSLog(#"%#",self.subviews);
}
return self;
}
-(void)setModel:(HorizontalModel *)model
{
_model=model;
self.categoryLabel.text=self.model.category;
[self sd_setImageWithURL:[NSURL URLWithString:[NSString stringWithFormat:#"XXXXX%#",self.model.imgURL]] placeholderImage:[UIImage imageNamed:#"obama"]];
}
Here is my code in the view controller.
-(void)addImage:(NSNotification *)notification
{
self.HArrayLists=notification.userInfo[#"array"];
for (int i=0; i<[self.HArrayLists count]; i++) {
JTImageView *imageView=[[JTImageView alloc] initWithFrame:CGRectMake(i*310, 0, 300, 200)];
imageView.model=[HorizontalModel restaurantsDetailWithDict: self.HArrayLists[i]];
[self.mediaScrollView addSubview:imageView];
}
self.mediaScrollView.contentSize=CGSizeMake(310*[self.HArrayLists count], 0);
}
It turns out that only the first imageView shows a label, while the rest of the imageViews show only images.
I think the core of your problem is the line:
self.categoryLabel=[[UILabel alloc]initWithFrame:CGRectMake(frame.origin.x, frame.origin.y, frame.size.width, 50)];
You are offsetting the x and y positions of the label by the x and y values of the image. This will place them outside the area of the image and with the image clipping, make them invisible. I think the line should be
self.categoryLabel=[[UILabel alloc]initWithFrame:CGRectMake(0, 0, frame.size.width, 50)];
to place all the labels at the top left corner of each image.
Having said that there are also a number of recommendations I would like to offer.
Firstly make all variable names start with a lowercase. So self.HArrayLists should be self.hArrayLists.
Secondly try and make variable names match their contents. So again looking at self.HArrayLists, perhaps something like self.imageData.
Next I would have done the composition differently. I would have a UIView to which I add both the UILabel and UIImageView instances. Using a parent view like this to layout two sub views often makes life easier.
I would also look into using a UICollectionView and UICollectionViewController rather than a UIScrollView. It will take you a bit of work to get your heads around how collection views work. But you will gain in terms of performance and better layout management.
Finally, study up on constraints. They're an essential part of building modern apps that can easily adapt to different sized screens, rotation and layouts.
You need to set as categoryLabel's frame properly.
self.categoryLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, frame.origin.y, frame.size.width, 50)];
I have a subview and I have been customizing its size by using the frame property and setting its value to the CGRectMake function's parameter values.
I have slowly but surely been changing the CGRectMake parameters and re-running the app to get the subview to the correct position on the screen but I know there has to be an easier way.
Here is what I am currently doing:
UIImageView *halfView = [[UIImageView alloc]initWithImage:image];
[self.view addSubview:halfView];
halfView.frame = CGRectMake(0, 0, 320, 270);
Is there a way that I can stop having to manually enter those 4 parameters into CGRectMake, and just set it to the top 50% of the screen?
Here is what I want the subview to look like on the iphone's screen:
halfView.frame = CGRectMake(0, 0, 320, self.view.bounds.size.height/2);
you just take the height and divide it by two
You should also probably change 320 to self.view.bounds.size.width
I suggest reading this post to really get a grasp of UIViews and working with them:
UIView frame, bounds and center
I have to implement 20 text boxes horizontally. How can I add a scroll bar to see all text boxes when I scroll to the left.
please try following code:
UIScrollView *scrlView=[[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 50)];
scrlView.scrollEnabled=YES;
int x=5;
int y=5;
for (int i=0;i<20;i++ ) {
UITextField *txtField=[[UITextField alloc] initWithFrame:CGRectMake(x,y , 100,40 )];
txtField.tag=i;
txtField.delegate=self;
[scrlView addSubview:txtField];
x+=105;
}
scrlView.contentSize=CGSizeMake(x, 50);
[self.view addSubview:scrlView];
i hope this code will help you.
You can find plenty of questions about this topic (i.e., Calculate the contentsize of scrollview), but nonetheless here is my solution:
You want to use the UIScrollView for the task. Using it is rather simple in fact.
First you need to initialise and display the UIScrollView somewhere in your screen. I am going to assume that you are in a UIViewController, and that you want to create a scroll view of 300px width and 200px height. For this, you can do the following:
UIScrollView *aScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 300, 200)];
[[self view] addSubview:aScrollView];
[aScrollView setScrollEnabled:YES];
Now its time to place the content inside of it.
The key idea here to take into consideration is the following. While the 'UIScrollView' has a size itself, it also has an internal size for it's content, which is essentially the are that is scrollable.
Let's suppose that you have 20 items, each of which has a size of '40px width', and '200px height'. I am also going to suppose that you will want to leave a space of 10px between each text box. Thus, the total scrollable width for the area that we want to have inside the 'UIScrollView' is the following: (20 (items) * (40 (size of each item) + 10 (distance between each item))) -10. We shall then do the following:
[aScrollView setContentSize:CGSizeMake((20*(40 + 10))-10), 200];
All right, we are almost done. Now all we have to do is add each of the text items to the scroll view. Instead of doing it one by one, I am going to assume that you have them inside a collection such as a NSArray (probably an NSMutableArray).
NSArray *textFields; // the array with the collection of text boxes
int x = 0;
for (UITextField *aTextField in textFields){
[aTextField setFrame:CGRectMake(x, 0, 40, 200)];
[[self view] addSubview:aTextField];
x += 40 + 10; // incrementing the X coordinate to correctly place the next item
}
That's it!
I have a UILabel in the main view with text - "Very Very long text". The proper width to this would be 142, but i've shortened it to 55.
Basically I want to implement a marquee type scroll, so I wrote code to add it onto a subview and animate it within the bounds of that view.
CODE --
CGRect tempLblFrame = _lblLongText.frame;
UIView *lblView = [[UIView alloc] initWithFrame:tempLblFrame];
//Add label to UIView at 0,0 wrt to new UIView
tempLblFrame.origin.x = 0;
tempLblFrame.origin.y = 0;
[_lblLongText setFrame:tempLblFrame];
[_lblLongText removeFromSuperview];
[lblView addSubview:_lblLongText];
//SetClipToBounds so that if label moves out of bounds of its superview, it wont be displayed
[lblView setClipsToBounds:YES];
[lblView setBackgroundColor:[UIColor cyanColor]];
[self.view addSubview:lblView];
After this I get this output on the simulator -->
The problem occurs when i try the Animation with this code -
tempLblFrame.origin.x = -_lblLongText.intrinsicContentSize.width;
[UIView animateWithDuration:2.0 delay:1.0 options:UIViewAnimationOptionCurveLinear
animations:^{
[_lblLongText setFrame:tempLblFrame];
}
completion:^(BOOL finished) {
NSLog(#"completed");
}];
I was hoping I would see the entire "Very Very long text", rather only "Very..." scrolls from left to right.
To solve this I added one line of code --
//Add label to UIView at 0,0 wrt to new UIView
tempLblFrame.origin.x = 0;
tempLblFrame.origin.y = 0;
tempLblFrame.size.width = _lblLongText.intrinsicContentSize.width; //THIS LINE WAS ADDED
[_lblLongText setFrame:tempLblFrame];
[_lblLongText removeFromSuperview];
[lblView addSubview:_lblLongText];
I thought the full text will be set inside the newly added UIView and it would scroll properly. But running in the simulator gave me this --
And again, only "Very..." was scrolling from left to right.
What am I doing wrong? Please help!!
EDIT
Apparently the culprit was AutoLayout.
I have no clue why, but once I unchecked "Use Autolayout" for the view
in the XIB, everything started working as expected. Setting
tempLblFrame.origin.x = -_lblLongText.intrinsicContentSize.width; was
working properly and so was the scroll.
Any explanation on this!!?
This question is possibly Duplicate of.
Although there is nice code snippet written by Charles Powell for MarqueeLabel,
also take a look at This link.
I hope this will help you and will save your time by giving a desired output.
Make the UILabel the width (or longer) of the text and the UIView the scroll area you want to see. Then set the UIView's clipToBounds to YES (which you are doing). Then when you animate left to right you will only see the the text the width of the UIView, since it is cutting any extra subviews. Just make sure you scroll the entire length of the UILabel.
Right now you are setting the view and label's height and width to the same thing. This is why you are getting clipped text, not a clipped label.
You add In your view scrollview and add this label in your scroll view .Use this code
scroll.contentSize =CGSizeMake(100 *[clubArray count],20);
NSString *bname;
bname=#"";
for(int i = 0; i < [clubArray count]; i++)
{
bname = [NSString stringWithFormat:#"%# %# ,",bname,[[clubArray objectAtIndex:i] objectForKey:#"bottle_name"]];
[bname retain];
}
UILabel *lbl1 = [[UILabel alloc] init];
[lbl1 setFrame:CGRectMake(0,5,[clubArray count]*100,20)];
lbl1.backgroundColor=[UIColor clearColor];
lbl1.textColor=[UIColor whiteColor];
lbl1.userInteractionEnabled=YES;
[scroll addSubview:lbl1];
lbl1.text= bname;
This is implemented code.Thanks
Apparently the culprit was AutoLayout.
I have no clue why, but once I unchecked "Use Autolayout" for the view in the XIB, everything started working as expected. Setting tempLblFrame.origin.x = -_lblLongText.intrinsicContentSize.width; was working properly and so was the scroll.
Still, a better explanation for this would surely help!!
EDIT: Solution with AutoLayout -
//Make UIView for Label to sit in
CGRect tempLblFrame = _lblLongText.frame;
UIView *lblView = [[UIView alloc] initWithFrame:tempLblFrame];
//#CHANGE 1 Removing all constraints
[_lblLongText removeConstraints:_lblLongText.constraints];
//Add label to UIView at 0,0 wrt to new UIView
tempLblFrame.origin.x = 0;
tempLblFrame.origin.y = 0;
//Set Full length of Label so that complete text shows (else only truncated text will scroll)
tempLblFrame.size.width = _lblLongText.intrinsicContentSize.width;
//#CHANGE 2 setting fresh constraints using the frame which was manually set
[_lblLongText setTranslatesAutoresizingMaskIntoConstraints :YES];
[_lblLongText setFrame:tempLblFrame];
[_lblLongText removeFromSuperview];
[lblView addSubview:_lblLongText];
I'm in an UIViewController, self.view points to a valid view with a frame of 300x480.
UIView *redView;
UIView *blueView;
//[[self view] setAutoresizingMask:YES]; //WRONG!
[[self view] setAutoresizesSubviews:YES];
[[self view] setClipsToBounds:YES];
redView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
[redView setBackgroundColor:[UIColor redColor]];
[redView setAutoresizingMask:UIViewAutoresizingFlexibleLeftMargin];
[[self view] addSubview:redView];
blueView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
[blueView setBackgroundColor:[UIColor blueColor]];
[blueView setAutoresizingMask:UIViewAutoresizingFlexibleRightMargin];
[[self view] addSubview:blueView];
With this snippet of code i was trying
To align the 200x200 red view to the right margin,
To align the 100x100 blue view to the left margin;
but the result as you can see is far from being what i was expecting...
http://imageshack.us/photo/my-images/27/iossimulatorscreenshoto.png/
I've read every single bit of apple documentation and every google result about the autoresizing mask usage, but i still can't figure out why this is happening.
Can someone please explain to me what is happening?
Thanks in advance.
Keep in mind it's an autoREsizing mask, not an autosizing mask. It doesn't do anything until something changes size.
What you want to do is define your views' frames exactly where you want them to be according to the current size of your parent view, i.e. 300 x 480. So for example
redView = [[UIView alloc] initWithFrame:CGRectMake(100, 0, 200, 200)];
blueView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
You are setting their autoresizing masks correctly as far as the horizontal alignment. If self.view changes size, then redView and blueView will remain locked to the margins.
You should set at least one of flexible top margin, flexible bottom margin, or flexible height. Otherwise the behavior is undefined if the parent view changes height. It's impossible for all three of those parameters to remain fixed within two different heights.
This line of code doesn't make sense:
[[self view] setAutoresizingMask:YES];
It isn't a compiler error because BOOL happens to be castable to UIViewAutoresizing, which is an enum. The effect is that YES = 1 = UIViewAutoresizingFlexibleLeftMargin. Probably not what you wanted. More likely you wanted:
[[self view] setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight];
If you can, you should do all this in Interface Builder. Since it's a WYSIWYG editor, you can SWYG ("see what you get"). You can quickly play around with the options and learn how they work. Much faster than edit - compile - run to see the effects. Even if you can't / won't use Interface Builder for your project, try a sample project with it to learn how autoresizing works. Once you know you can do it in code with less trial and error. But watch out for the gotcha that turning a margin bar on in Interface Builder is equivalent to turning the corresponding FlexibleXYZMargin option off in code.