I created a UISwitch using this code...
UISwitch *switch = [[UISwitch alloc]initWithFrame:CGRectMake(110, 230, 60, 60)];
[window addSubview:switchView];
[switchView release];
The created button will be....
The default properties are,
It contains "ON" & "OFF" states
The OFF button is white & the ON button is in blue color
I want to create a customized switch, so that the background color & text in the switch should be changed. Is it possible? Please explain in detail.
Thanks in Advance,
Rajkanth
You can not modify UISwitch control unless and until you write your own control,
But best way so far, you can used UISegmentControl and handle event on it to switch the on.png and off.png images.
UISegmentedControl* switchView=[[UISegmentedControl alloc] initWithItems:[[[NSMutableArray alloc] initWithObjects:#"On",#"Off",nil] autorelease]];
[switchView setFrame:CGRectMake(20,365,140,28)];
switchView.selectedSegmentIndex=0;
switchView.segmentedControlStyle=UISegmentedControlStyleBar;
[switchView setImage:[UIImage imageNamed:#"onSelected.png"] forSegmentAtIndex:0];
[switchView setImage:[UIImage imageNamed:#"off.png"] forSegmentAtIndex:1];
[switchView addTarget:self action:#selector(checkOnOffState:) forControlEvents:UIControlEventValueChanged];
self.navigationItem.titleView=switchView;
and write checkOnOffState method code like this-
-(IBAction)checkOnOffState:(id)sender{
UISegmentedControl* tempSeg=(UISegmentedControl *)sender;
if(tempSeg.selectedSegmentIndex==0){
[tempSeg setImage:[UIImage imageNamed:#"onSelected.png"] forSegmentAtIndex:0];
[tempSeg setImage:[UIImage imageNamed:#"off.png"] forSegmentAtIndex:1];
}
else{
[tempSeg setImage:[UIImage imageNamed:#"on.png"] forSegmentAtIndex:0];
[tempSeg setImage:[UIImage imageNamed:#"offSelected.png"] forSegmentAtIndex:1];
}
}
I used this solution: UICustomSwitch: it works customizing a UISlider and setting a max valure of 1.
You can change the images of your switch, the right / left text and use it with a unique color on background (if you don't want to use images).
The only change I did was about the name: UI is reserved for Apple classe, so I changed it for my own.
Related
I created a UIBarButton programmatically with the following code:
UIButton * rightButton = [UIButton buttonWithType:UIButtonTypeCustom];
[rightButton setFrame:CGRectMake(0, 0, 81, 30)];
[rightButton setBackgroundColor:[UIColor clearColor]];
rightButton.layer.borderColor = [UIColor blackColor].CGColor;
rightButton.layer.borderWidth = 0.5f;
rightButton.layer.cornerRadius = 5.0f;
rightButton.titleLabel.font = [UIFont fontWithName:#"HelveticaNeue-Bold" size:12];
[rightButton setTitleShadowColor:[UIColor blackColor] forState:UIControlStateNormal];
[rightButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
//set text according to sign in status
if (signIn) {
[rightButton setTitle:#"5 votes left" forState:UIControlStateNormal];
} else {
[rightButton setTitle:#"Sign in" forState:UIControlStateNormal];
}
UIBarButtonItem * rightBarButton = [[UIBarButtonItem alloc] initWithCustomView:rightButton];
self.navigationItem.rightBarButtonItem = rightBarButton;
The obtained button has the desired aspect but now what I need is that when the status of the button is highlighted there should be a gradient effect fading to black to let the user know that he has pressed the button, because right now when I pressed the button, nothing happens to the view so the user has no way to know that he has pressed the button.
I want to explore a choice that does NOT involve setting the background images for the desired states because the text of the button can change dynamically according to the app configurations so I need to do this entirely by code.
Although this won't directly answer your question, it may help. I had to create some graphics for a button dynamically and came up with a method using core graphics to create my button image. It gives me the flexibility to change to appearance parametrically in the code.It draws the button image in an abstract graphics context and then converts the result into an image that I can use for my button. YOu might get enough out of my explanation that you can try it yourself for your needs.
Subclass UIButton and add a CALayer or CAGradientLayer to achieve the highlight effect that you want. Set the initial state of the highlight layer to hidden. Override setHighlighted: with something like:
- (void) setHighlighted:(BOOL)highlight {
highlightLayer.hidden = !highlight;
[super setHighlighted:highlight];
}
My custom UISegmented control has background images [for each state]. How do I add text above the images [for each state, meaning that when index 0 will be selected I will have a specific color and font] ?
Here's how my UISegmented control looks like:
UISegmentedControl *customUISC=[[UISegmentedControl alloc] initWithItems:[[[NSMutableArray alloc] initWithObjects:#"ON",#"OFF",nil] autorelease]];
[customUISC setFrame:CGRectMake(11,14,298,28)];
customUISC.selectedSegmentIndex=0;
customUISC.segmentedControlStyle=UISegmentedControlStyleBar;
[customUISC setImage:[UIImage imageNamed:#"FirstTabActive.png"] forSegmentAtIndex:0];
[customUISC setImage:[UIImage imageNamed:#"SecondTab.png"] forSegmentAtIndex:1];
[customUISC addTarget:self action:#selector(checkOnOffState:) forControlEvents:UIControlEventValueChanged];
and the checkOnOffState method looks like:
-(IBAction)checkOnOffState:(id)sender{
UISegmentedControl *iSeg=(UISegmentedControl *)sender;
if(iSeg.selectedSegmentIndex==0){
[iSeg setImage:[UIImage imageNamed:#"FirstTabActive.png"] forSegmentAtIndex:0];
[iSeg setImage:[UIImage imageNamed:#"SecondTab.png"] forSegmentAtIndex:1];
}
else {
[iSeg setImage:[UIImage imageNamed:#"FirstTab.png"] forSegmentAtIndex:0];
[iSeg setImage:[UIImage imageNamed:#"SecondTabActive.png"] forSegmentAtIndex:1];
}
}
I'm not sure I fully understand what you're after, but could you just make use of UILabels (positioned above the images). You could then change the colours and text quite easily using myLabel.text and myLabel.textColor.
Hope this helps in some way!
On a navigationBar as a rightBarButtonItem I take edit button by the following coding
self.navigationItem.rightBarButtonItem=self.editButtonItem;
but I want to change the color of edit button I mean I want to change the color of rightBarButtonItem. How can I do this?
plz reply as early as possible.
thanx in advance.
You will need to create a custom button and initialize your UIBarButtonItem using initWithCustomView.
Create your UIButton as you like if with your custom image and then:
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:yourUIButton];
You are constrained making standard UIBarButtonItem. But you can init it with any UIView of your choice, e.g. standard UIButton which you can color as you like.
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
myButton.frame = CGRectMake(0, 0, 30, 20); // change as you like being constrained with navigation bar hieght
[myButton setTitle:#"My Button" forState:UIControlStateNormal];
[myButton setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
[myButton setImage:[UIImage imageNamed:#"Image for my button.png"] forState:UIControlStateNormal]; // <-- you can provide image instaed of title if you like
[myButton setBackgroundImage:[UIImage imageNamed:#"Background image for my button.png"] forState:UIControlStateNormal];
[myButton addTarget:self action:#selector(myAction) forControlEvents:UIControlEventTouchUpInside]; // <-- don't forget configure this!!!
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:myButton];
Visit this link. It is kind of same answer.
specially indicating or highlighting a toolbar button when a note is added in iphone
Usage of method [[UIBarButtonItem alloc] initWithCustomView:btnInfo]; can help.
I am using a UISegmentedControl with some custom images:
UISegmentedControl *segmentedControl = [[UISegmentedControl alloc] initWithItems:nil];
[segmentedControl insertSegmentWithImage:[UIImage imageNamed:#"0.png"] atIndex:0 animated:NO];
[segmentedControl insertSegmentWithImage:[UIImage imageNamed:#"1.png"] atIndex:1 animated:NO];
[segmentedControl insertSegmentWithImage:[UIImage imageNamed:#"2.png"] atIndex:2 animated:NO];
segmentedControl.frame = CGRectMake(0, 0, 90, 30);
[self.view addSubview:segmentedControl];
[segmentedControl release];
This part works fine. But, it still uses Apple's styling for the control and just adds my images over it. Is there a way that I don't have to use Apple's styles, and customize the conrol with my own images with no background? I would also like to have my own "selected" state images.
Possible?
Nic,
After playing with this for a while, I decided to simply "roll my own" in a way.
I made some button images in photoshop and got everything looking like a segmented control. Then, I set a different image for the "selected" states of all the buttons. When one button was pressed, I called setSelected:NO to the others. Then, I handled whatever I needed to do.
I'd love to hear other solutions.
In addition to DexterW's answer. I had came to same decision - to mimic UISegmentedControl using UIButtons only.
However its not a simple task to mimic UISegmentControl. I tried to use Selected state of a UIButton but UIButton wont work as expected if set same settings (bg image, font color) for Hightlighted and Selected states. In such case when segment looks selected its still "pressable" visually. So, to avoid it and make buttons set acting more like UISegmentedControl I didn't use a selected state at all. Instead Id decided to change appearance of selected button in code so that normal and highlighted states are the same visually for selected button and different for unselected one.
Assume I have 3 buttons segmentedControl (LeftSgm | MiddleSgm | RightSgm) and for normal state Im using bg picture named "segment_default" and font color white and for selected state its bg picture named "segment_active" and black font. So in onTouchDown:
-(IBAction)onTopMenuTap:(id)sender
{
int newSelectedSegmentIndex;
if (sender == btnLeftSgm)
newSelectedSegmentIndex=0;
else if (sender == btnMiddleSgm)
newSelectedSegmentIndex=1;
else if (sender == btnRightSgm)
newSelectedSegmentIndex=2;
else
return;
NSLog(#"Tapped segment index %d while old one is %d",newSelectedSegmentIndex,selectedSegmentIndex);
if (newSelectedSegmentIndex==selectedSegmentIndex)
return;
[self handleSegmentAppearenace:newSelectedSegmentIndex];
//do whatever its need to be done
...
}
and the called method is
-(void)handleSegmentAppearenace:(int)newSelectedSegmentIndex
{
if (selectedSegmentIndex==0){
[btnLeftSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_default_left"] forState:UIControlStateNormal];
[btnLeftSgm setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
btnLeftSgm.highlighted = NO;
}
else if (selectedSegmentIndex==1){
[btnMiddleSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_default_center"] forState:UIControlStateNormal];
[btnMiddleSgm setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
btnMiddleSgm.highlighted = NO;
}
else if (selectedSegmentIndex==2){
[btnRightSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_default_right"] forState:UIControlStateNormal];
[btnRightSgm setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
btnRightSgm.highlighted = NO;
}
if (newSelectedSegmentIndex==0){
[btnLeftSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_active_left"] forState:UIControlStateNormal];
[btnLeftSgm setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
btnLeftSgm.highlighted = YES;
}
else if (newSelectedSegmentIndex==1){
[btnMiddleSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_active_center"] forState:UIControlStateNormal];
[btnMiddleSgm setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
btnMiddleSgm.highlighted = YES;
}
else if (newSelectedSegmentIndex==2){
[btnRightSgm setBackgroundImage:[UIImage imageNamed:#"segmented_control_active_right"] forState:UIControlStateNormal];
[btnRightSgm setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
btnRightSgm.highlighted = YES;
}
}
All three buttons are bound in IB to corresponding properties (btnRightSgm etc). Also for "touch up event" onTopMenuTap is bound.
Cant say its a best idea but it works perfectly for me.
I am trying to make a standard check box for my iPhone app from a UIButton with a title and image. The button image changes between an "unchecked" image and a "checked" image.
At first I tried subclassing UIButton but UIButton has no -init*** method to use in my -init method.
What is the best way to do this?
Thanks in advance.
You shouldn't need to subclass the UIButton class. By design, Objective-C favors composition over inheritance.
UIButton is a subclass of UIControl, which has a selected property. You can use this property to toggle the on/off behaviour of a checkbox, just the same way a UISwitch does.
You can attach an action to the button's touched up inside event, and perform the toggling in there, something like this:
// when you setup your button, set an image for the selected and normal states
[myCheckBoxButton setImage:checkedImage forState:UIControlStateSelected];
[myCheckBoxButton setImage:nonCheckedImage forState:UIControlStateNormal];
- (void)myCheckboxToggle:(id)sender
{
myCheckboxButton.selected = !myCheckboxButton.selected; // toggle the selected property, just a simple BOOL
}
Set the images in the button:
[button setImage:uncheckedImage forState:UIControlStateNormal]
[button setImage:checkedImage forState:UIControlStateSelected]
Now all you need to do is:
button.selected = state
and the correct images will display.
All you need to do is set 2 different images for the states UIControlStateNormal and UIControlStateSelected, then in your selector, changed the selected property of the button.
Here is a working example (replace image names with your own):
- (void)loadView {
// ...
UIButton *chkBtn = [UIButton buttonWithType:UIButtonTypeCustom];
[chkBtn setFrame:CGRectMake(0, 0, 300, 25)];
[chkBtn setImage:[UIImage imageNamed:#"UNCHECKED.png"]
forState:UIControlStateNormal];
[chkBtn setImage:[UIImage imageNamed:#"CHECKED.png"]
forState:UIControlStateSelected];
[chkBtn addTarget:self
action:#selector(chkBtnHandler:)
forControlEvents:UIControlEventTouchUpInside];
// Optional title change for checked/unchecked
[chkBtn setTitle:#"I am NOT checked!"
forState:UIControlStateNormal];
[chkBtn setTitle:#"I am checked!"
forState:UIControlStateSelected];
[self.view addSubview:chkBtn];
[chkBtn release], chkBtn = nil;
// ...
}
- (void)chkBtnHandler:(UIButton *)sender {
// If checked, uncheck and visa versa
[sender setSelected:!sender isSelected];
}
For anyone interested in the future - instead of doing it yourself just download the link below from GitHub and it has it subclassed from UIControl already and functions perfectly as a checkbox. Also includes a sample project on how easy it is to use:
https://github.com/Brayden/UICheckbox
I have used M13Checkbox in one of my projects. Works ok.
https://github.com/Marxon13/M13Checkbox
Did you try overriding the initWithCoder method, just in case it is loaded from a nib somehow?
UIImage* nonCheckedImage=[UIImage imageNamed:#"ic_check_box_outline_blank_grey600_48dp.png"];//[UIImage init
UIImage* CheckedImage=[UIImage imageNamed:#"ic_check_box_black_48dp.png"];//[UIImage init
//ic_check_box_black_48dp.png
[_checkBox setImage:CheckedImage forState:UIControlStateSelected];
[_checkBox setImage:nonCheckedImage forState:UIControlStateNormal];
}
- (IBAction)checkBoxToggle:(id)sender {
_checkBox.selected = !_checkBox.selected; // toggle the selected property, just a simple BOOL
}
the image you can use google icon
Try this:-
-(IBAction)clickCheckButton:(UIButton *)sender {
if (sender.tag==0) {
sender.tag = 1;
[sender setImage:[UIImage imageNamed:#"check.png"] forState:UIControlStateNormal];
}else
{
sender.tag = 0;
[sender setImage:[UIImage imageNamed:#"uncheck.png"] forState:UIControlStateNormal]; } } sender.tag = 0;
[sender setImage:[UIImage imageNamed:#"uncheck.png"] forState:UIControlStateNormal];
}
}
Why not use a switch - UISwitch? This is used to display an element showing the boolean state of a value.