How to set UISlider' trackImage (using pattern) - iphone

I hope to how to set UISlider's trackImage.
My image is this.
I want to use pattern.
But, I cannot find way.
Please tell me hint.

You can create a resizable image and make it so that the resizing is done using tiling. As you don't have any caps on the image you can do something like this...
UIImage *trackImage = [[UIImage imageNamed:#"TheImage"] resizableImageWithCapInsets:UIEdgeInsetsZero resizingMode:UIImageResizingModeTile];
Then use this image on the slider...
[slider setMinimumTrackImage:trackImage forState:UIControlStateNormal];
This will then tile the image horizontally. As long as your pattern matches up edge to edge then it will work.

You can try creating a UIColor using the image as a pattern, and then setting it in the slider.
[slider setMinimumTrackTintColor:[UIColor colorWithPatternImage:/*your image*/]];

Related

UIButtonTypeCustom image deformed

customBtn = [UIButton buttonWithType:UIButtonTypeCustom];
[customBtn setFrame:CGRectMake(200,200,68,68)];
UIImage *btnImage = [UIImage imageNamed:#"dash_pulsante_attivo"];
[customBtn setImage:btnImage forState:UIControlStateNormal];
[customBtn addTarget:self action:#selector(triggerMeasurement) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:customBtn];
I'm building a custom button that should be using a 68x68 png for it's normal state.
But the image looks deformed: it should be a circle, but it display as an oval.
Any hint or suggestion why it is happening? Curiously, I've tried to swap with another circular png, 220x220, and everything works as expected.
I hope this error happened, because of image size, check whether the image size is 68x68.
nothing wrong in your code.
check the image "dash_pulsante_attivo" resolution. If it's less than 68*68 it supposed to get distorted. Higher resolution won't have distortion problem.
If you want resize your image programatically. You can do like this.

iOS Background Image doesn't display properly?

I've literally piled through hundreds go searches on google :(. I can't seem to figure out what I'm doing wrong when I create an image in photoshop (960 x 600, -40 for the status bar). The image comes out to this:
When it should look like this:
(note this is not the actually size, crappy thumbnail version :P. The size is as stated above)
This is my code:
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"MenuBkground.png"]];
Am I doing something wrong when I make the image? Is it in the code? Any ideas?
You're using colorWithPatternImage which basically means what it says. The image will repeat itself if the space is not entirely consumed by the image. If you want to have a true background image you should create the image as a subview.
UIImage* image = [UIImage imageNamed:#"MenuBKground.png"];
UIImageView* background = [[UIImageView alloc]initWithImage: image];
[self.view addSubview: background];
Another way if your using interface builder,
Drag an image view to your viewController.
Assign that as MenuBkground.png in the inspector (first drop down box)

How to make UISlider's "track" invisible?

I'm trying to emulate Apple's "Slide to Unlock" feature in my application. I get to this point (image below), but as you can see the UISlider's "track" is visible and is covering up my text. Is there a way to change an attribute programmatically that will make the "track" invisible?
Please let me know if you need any of my code.
Thanks in advance!
EDIT: If I change the slider's alpha to 0, it gets rid of my sliding button, so doing that won't work unless I'm doing it wrong. :)
here's an even easier way. No need to create images, just instantiate an empty UIImage class :P
UIImage *clearImage = [[UIImage alloc] init];
[self.slider setMinimumTrackImage:clearImage forState:UIControlStateNormal];
[self.slider setMaximumTrackImage:clearImage forState:UIControlStateNormal];
Actually I just figured it out. Here's what I did:
UIImage *sliderMinimum = [[UIImage imageNamed:#"clearTrack.png"] stretchableImageWithLeftCapWidth:4 topCapHeight:0];
[slider setMinimumTrackImage:sliderMinimum forState:UIControlStateNormal];
UIImage *sliderMaximum = [[UIImage imageNamed:#"clearTrack.png"] stretchableImageWithLeftCapWidth:4 topCapHeight:0];
[slider setMaximumTrackImage:sliderMaximum forState:UIControlStateNormal];
clearTrack.png is just a clear slider image I made.
Now I have this: yay!
There probably isn't a way to hide the track; the "slide to unlock" doesn't behave like a UISlider and is probably a custom control. You might be able to hack the slider control, maybe by setting opacity low (0 will make it hidden and it won't receive touches), but if you go that route you will probably have something break after an OS update. Apple doesn't bend over backwards for compatibility like Microsoft does.
The right way to do this is with a custom control. It may seem like more work than using a UISlider, but it's not if you compare it against all the time you have spent and/or will spend hacking a UISlider.
To do it: subclass UIControl. Write your own drawing code to make it look right (you can probably reuse some of whatever you are doing now). Then register for touch events to move the slider handle:
UIControlEventTouchDown: if it's on the handle, set a "moving" flag
UIControlEventTouchDragInside: if the moving flag is set, move the handle to the touch position; you can just update an instance variable, call setNeedsDisplay to draw it in the new position.
UIControlEventTouchUpInside: if moving flag is set, and handle is at end, unlock
If you want to mimic the real unlock handle, play around with it and see how it behaves. You might need to respond to the events differently (what happens if you drag outside the slider path). But you should be able to get the gist of it.
In Swift:
slider.setMinimumTrackImage(UIImage(), forState: .Normal)
slider.setMaximumTrackImage(UIImage(), forState: .Normal)
In answer to the stated question, you can set a transparent 1px png for the minimum and maximum track images.
Looks like just setting the tint color to clear does it...
[slider setMinimumTrackTintColor:[UIColor clearColor]];
[slider setMaximumTrackTintColor:[UIColor clearColor]];
Answer by #Arjay Waran is the best in my opinion.
Heres the Swift 3.0 Version of it.
slider.minimumTrackTintColor = UIColor.clear
slider.maximumTrackTintColor = UIColor.clear
Cheers
From Story Board:-
select clear color for Min Track and Max Track

If I create a PNG image in photoshop with 85% opacity, how can I maintain that same level of opacity when I add it to my iOS app?

If I create a PNG image in Photoshop and lower the opacity so it's 85% opaque, how can I maintain that same level of transparency when I add it to my iOS app?
I'm trying to set the background image of a UILabel to be this image, but the background image for the UILabel is fully opaque in my iOS app. Here's my code...
[lbl setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"labelBackground.png"]]];
Am I missing something or is this not possible?
Thanks so much for your wisdom!
If I were you, I'd put an UIImageView containing the image behind your UILabel. Then make sure your UILabel and UIImageView backgroundColors are both set to [UIColor clearColor]. That's how I do it anyway.
Have you tried lbl.opaque = NO;?
From my experience, iOS preserves opacity for PNG images.
I think I have an idea of what MAY be wrong (and pardon me for making any wrong assumptions)...
In photoshop, when saving a PNG image, there's an option to "Save Transparency" or something like that. Make sure that is checked before you save the PNG.
If this is not the problem, you can always use:
UIImageView.opacity = 85.0f/100.0f;
Let me know if this solves your problem :)
I ran into some background issues just like you, but I learned that most UIView subclasses have a backgroundView property which is accessed like this:
[aView backgroundView];
or
aView.backgroundView = someView;
UIImageViews keep the opacity of images. With these two things in mind you can just do:
UIImageView *imageView = [UIImageView initWithImage:[UIImage imageNamed:#"YourImage.png"]];
myLabel.backgroundColor = [UIColor clearColor];
myLabel.backgroundView = imageView;
I hope you find this useful.

Stretchable image stretching part wider than 1px

I would like to create a UIButton which uses a stretchable image as Background image such as that I can easily resize the button for different labels etc.
So I created the following code which works fine:
UIImage *bgImage = [[UIImage imageNamed:#"Button-Template.png"]stretchableImageWithLeftCapWidth:2 topCapHeight:2];
UIButton *loginButton = [UIButton buttonWithType:UIButtonTypeCustom];
loginButton.frame = CGRectMake(180, 280, 112, 40);
[loginButton setBackgroundImage:bgImage forState:UIControlStateNormal];
// some more stuff
Now here is the catch: The iPhone SDK assumes that the strechable part of the image is exactly one pixel in width, which is not the case in my image as I want to create a pattern, which requires a repetition every two pixels (so 2 Pixels are one pattern unit). I have found no information in the docs whether it is possible to alter the value of the strechable part width (in my case 2 instead of 1), does anybody know how to do this or how I could achieve my goal with a workaround? Writing the stretching part on my own seems a little far fetched right now (though I might have to get back to this).
Thanks!
From iOS 5.0 on you could use resizableImageWithCapInsets:
Check UIImage Class Reference
But this method only works on iOS >= 5.0 devices, so that can be a
turn down for now.
There is no API for using 2 pixels as the stretch width. You'll have to implement this behaviour yourself in a custom view, or use an image with a specific width.