UISlider setThumbTintColor with [UIColor colorWithPatternImage:] makes thumb transparent on highlight - uislider

I tried to make the thumb on my UISliders have a brushed metal look using setThumbTintColor and using UIColor's colorWithPatternImage but when I start to scrub with it the thumb becomes mostly transparent. I've tried many things but havent found anything that helps. Has anyone else ran into this type of problem?
UISlider normal image:
UISlider highlighted image:

I figured out a workaround on this one. Put this one in my viewDidLoad.
[mySlider setThumbImage:[mySlider currentThumbImage] forState:UIControlStateHighlighted];

Related

Custom UIButton iphone

I want to change the color of my UIButton. I did this:
UIButton *alreadySubscriber = [[UIButton alloc] initWithFrame:CGRectMake(12, maxy-65, 262.0, 50)];
alreadySubscriber.layer.cornerRadius = 10.0f;
[alreadySubscriber setBackgroundColor:[UIColor orangeColor]];
[alreadySubscriber setTitle:#"Already a subscriber" forState:UIControlStateNormal];
The color of the button changes, but no longer see the effect of bright light booby top. how can I fix this?
We're unable to programmatically set this 'bubble effect' for the UIButton I'm afraid. The only way to go about it far as I can tell is to go for a custom button with an image (or two images for the normal and active states).
The resource Eugene put up earlier seems pretty good in fact.
I don't really know what kind of booby light are you talking about, but have you tried using images for your buttons? I'd suggest using two different images like those you can create here http://dabuttonfactory.com/.
You should create as a custom button and add the image/color as background.

Why are these UIImages so "blurry"?

In an app I'm working on, I've got a few UIImages which for some reason come out really blurry. This specifically applies to two icons I use which are fairly small (80x15 and 65x15).
(Update: added iPad Simulator output as well -- it is blurry just as the iPad output)
Top left and right are original images, bottom left and right are how they come out on the iPad. I actually got complaints about these being awfully blurry from users, so it's not just me.
The code where one of these is put in place looks like this (can show code for other one at request):
UIButton *bWeb = [[UIButton alloc] initWithFrame:
CGRectMake(attriboffset, height - 20.f, 65.f, 15.f)];
[bWeb addTarget:self action:#selector(clickWebLink:)
forControlEvents:UIControlEventTouchUpInside];
bWeb.userInteractionEnabled = YES;
[bWeb setImage:[UIImage imageNamed:#"button-weblink-65x15.png"]
forState:UIControlStateNormal];
[bWeb setImage:[UIImage imageNamed:#"button-weblink-highlighted-65x15.png"]
forState:UIControlStateHighlighted];
[self addSubview:bWeb];
[bWeb release];
The original images are (in case you think it might be a formatting issue with the actual PNG files): ,
Make sure that all numbers in UIButton's frame are rounded/truncated to integers.
What is attriboffset?
Like hoha says, if the numbers are not integers, you will end up with fractional offsets, and devices will do some blurry antialiasing to compensate for that. The numbers should not have fractions.
I think that for some reason the image is being rendered with some kind of unnecessary processing that is causing the quality loss.
Try changing the contentMode property of your UIButton to UIViewContentModeCenter. The default is UIViewContentModeStretch.
Open your images in preview and resave them.

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.

Loading MPMoviePlayerViewController with transparent background?

i´ve added a MPMoviePlayerViewController instance and playing of a movie works great.
I´ve 3 buttons and want to load different videos in a UIView-container. That works, too.
But if i click on a button to load an other video, everytime the background is flickering black.
I´ve set the color to "clearColor":
player.moviePlayer.backgroundView.backgroundColor = [UIColor clearColor];
But that doesn´t help. Is there a way to load a video without a background - only the video-content?
Thanks for your time.
Not sure about the flickering issue. You said it flickers when you load another video -- Are you unintentionally layering multiple videos on top of each other? Make sure you remove the old one!
The black background likely is because your
MPMoviePlayerController's
scalingMode property is set to MPMovieScalingModeAspectFit (Apple's Documentation:
MPMoviePlayerController
scalingMode)
For issue #2, like you, I had expected setting the backgroundView's color to handle this, however it seems there is another view behind that which you also need to set the backgroundColor to clearColor. My hack for this was to simply iterate through the movie player's subviews and set their backgroundColor to clear.
Hack/"Solution" example using your variable name:
for(UIView* subV in player.moviePlayer.view.subviews) {
subV.backgroundColor = [UIColor clearColor];
}
You have to re-apply clearColor to the subviews any time you enter/exit fullscreen mode as well. I hope someone else has a better solution because this method seems pretty kludgy.
another option is to hide the video player and then show it when it is ready to display
caveat needs IO6>= i believe:
https://stackoverflow.com/a/19459855/401896