NSButton draw alternate image on click - objective-c

I know this is probably super easy, but I'm having a hard time wading through header files and could use some guidance.
I have an NSPopUpButton defined in a nib with a menu attached to it. I have defined it in the nib to be "Pull Down" type with no arrow (the images given to me by our designer include a special arrow he wants to use). It is a borderless button. The title properly is empty, though I have set the image and alternateImage.
What I'm looking for is a configuration, either in the nib, file's owner implementation, or by subclass NSPopUpButton, that will allow me to display the button's alternate image (or any other image) while the button's menu is being displayed. Instead, it looks like the system is dimming the button's image.
I've tried numerous nib configurations, various properties of NSButton and NSButtonCell, overriding mouseDown and mouseUp. Nothing I do works.

If playing with the "Type" property doesn't help, you may well have to subclass the drawing of NSButtonCell to get what you want.
- (void)drawImage:(NSImage *)image withFrame:(NSRect)frame inView:(NSView *)controlView in NSButtonCell seems promising.

I think it's custom NSButtonCell class time; I don't know of any way to override the theme for this type of button.
Your only alternative would be to use a regular NSButton with the appropriate image and show the menu at the correct position manually, which would probably be a lot easier to implement.

Related

Change a button's background image programmatically in cocoa

All of the topics that I have searched are outdated or not complete in Obj-c.
I need to learn how to change a button's background image programmatically, when having the actual button in the InterfaceBuilder. (This sounds odd, but I need it for NSCollectionView as I have many similar button with different background images).
In the interface builder I drag a button onto my view window, what should I do after?
I understand that:
I need to create a NSButton Class
Connect the button from the interface builder to the code
Set the image
I have been struggling with this.
So did you connect the button to an IBOutlet property? If so then all you need to do is use [button setImage:]
If you haven't already done so, make sure the object instance that you want to change the image from is in interface builder, I.e has been dropped in as one of those blue boxes. Then if you set the object's class and have an IBOutlet property in the header file you can just drag the button outlet in the outlets tab (looks like an arrow) to the actual button itself to link the two
Edit: So it appears you're having trouble with the actual connecting part of the button? Chances are your IB file looks a bit like this:
Look for the objects section in the left hand list. These are the actual objects in your code that you can connect your button to. You might see an app delegate object there, which is included in the default IB file generated when you first create a project. If you want to handle the image changing in your app delegate, then simply add this property to your AppDelegate.h file to create an outlet:
#property IBOutlet NSButton *button;
If you go back to interface builder and select the app delegate object, you can see the outlet that you just created under the outlet tab:
Drag the little circle thing to the button to connect it, that should be the easiest bit.
But I'm going to just presume that you want to call it from somewhere else other than your app delegate, and for that we'll need to do some more explaining. If the class you want to call it from is a subclass of NSView and is already in your interface builder, you can just add that line to your view's header file and it will appear under the view's outlet tab.
If you want to call this from another object that isn't a view or such, you'll need to do either two options:
Create the object instance in interface builder. This means that instead of creating in normally with alloc] init]; etc. you'll have to actually drag in an object into interface builder. This can change the structure of your object quite a bit as you'll no longer be able to create it at will, since it will automatically be instantiated whenever you load your .nib file. Also important to note is that your init function will not be called anymore and you'll need to use awakeFromNib instead. If you do choose to go down this route, just drag over an object:
Add your outlet property to the header file:
Set the object's class:
And connect the outlet:
If making objects XIB loaded just isn't your thing, you can always just connect the property outlet to your app delegate/view controller and access it from that instead. Hopefully this clears things up, if this was the problem you were having.
For iOS:
Don't need to create a NSButton subclass.
You only need to add button on Storyboard, set the IBOutlet property for your button (ctr+drag from your button to your view controller), and set the background image with:
[myButton setBackgroundImage:[UIImage imageNamed:#"ImageName"] forState:UIControlStateNormal]
For MacOS:
You can use
setImage:
as describe on Apple Doc, and changes its size/position
(Sorry for my bad English)
ofcourse as Duukee Said,i think no need to create any NSButton Or UIButton Instances Manually When We have an object in Interface Builder,We can just use it's outlet as follows,
UIImage* Desired_Image=[UIImage imageNamed:#"yourimage.png"];
[My_Button setimage:Desired_Image forState:UIcontrolstateNormal];
HTH!Happy Coding :)

Change NSButton title position

I want to change the title position of NSButton that has a background image so that i can place the title in the bottom left corner of the button and in the same time overlaps the image
Sounds like you need to override the drawing methods in NSButtonCell (that's what NSButton uses for drawing). I've created subclasses that "fake out" the NSButtonCell implementation for simple adjustments. To do this, create a subclass of NSButtonCell and set it up as the cell for your NSButton. Next override the drawing methods of NSButtonCell (there are multiple depending on what you're trying to do), adjust your target frame and then call the superclass (NSButtonCell) implementation.
Depending on how much you need to do though, you may just be writing your own drawing methods. This gives you the most control.

Xcode-style font picker

I'd like to add a font picker in my app. Xcode's Interface Builder has a great implementation which is used in Xcode's own preferences' window too.
It's the one with a little 'T' button (seemingly) inside the font name text field itself.
Is this a standard cocoa implementation?
You'll need to roll your own. See Subclassing NSControl. You'll subclass NSTextField and NSTextFieldCell. Read the entire guide, actually. Once you've got a good understanding, then you can override the drawing/geometry routines to return a rect whose width is slightly smaller (small enough to leave room for the font "button"). Then draw your font button. You'll respond to its mouse events on the font button the same as you would for any NSView.
There's no standard control for the preview text box with the button, but there is the standard NSFontPanel class that you can use to let users select the font once the 'T' button has been clicked.
Best idea is probably to override NSTextFieldCell. I've been able to get the desired appearance by overriding -drawInteriorWithFrame:inView:, and passing a slightly less wide frame when calling through to super, then drawing the button myself. You'd also have to implement the mouse tracking of the button yourself, but you could probably just create your own NSButtonCell instance and call through to it for a few methods with the sub-rect for the button.
For convenience, you may also want to create a NSTextField subclass that uses this cell instead of a straight NSTextFieldCell, but if you're loading stuff from a XIB, you can just change the class of the cell in the XIB and leave it in a regular text field view.

Add a second image to a custom UIButton

I've got an Custom UIButton. It's got
a "static" background image
a variable text (the Title) which gets set in the code
Now I would like to add an icon (UIImage/UIImageView) inside the button on the left of the text. (I use the indent to move the text slightly to the right). Is there an easy way of adding that icon (and referencing it from code, so I can change it) or would you recommend creating a completely new button e.g. based on a UIView? (e.g. a view, that responds to touches)?
I'm just trying to get a feel for what the best approach would be for this. Any experience?
Two ways:
I prefer doing this by subclassing a UIView and (as you mention) implement the UITouch-responder methods. You're also able to override drawRect: what I really like because it makes your app soooooo much faster!
Since UIButton is a subclass of UIView, you can add a UIImageView to your button by using addSubview:. If you save it in your main-class (#property (...) UIButton *button) you can always access it by calling [self button]. You can also subclass your UIButton and add this #property. That's up to you.
It's totally up to you. However I prefer the first way!

Looking for info on custom drawing of interface components (Cocoa)

It seems like more and more OS X apps these days are doing all kinds of fancy drawing stuff for custom controls. Apps like Twitterific, Things, EventBox, Versions just to name a few....
So basically I'm looking for any information on how to get started doing this kind of thing. Not sure if it is just done by subclassing controls and using custom drawing or if it is something entirely different.
Any help is greatly appreciated. THanks!
It depends entirely on what you want to do.
The "Show Raw Properties" button in Versions for instance is an NSButton subclass, because basically what we needed is standard button behavior with our own look.  One way to subclass a button is to simply implement your own -drawRect:(NSRect)rect method in the NSButton subclass, but we decided to stick with the way NSButton is implemented in Cocoa, meaning most drawing is done by the button's cell, so the implementation looks like this:
In the NSButton subclass:
+ (Class) cellClass
{
return [OurButtonCell class];
}
- (void)drawRect:(NSRect)rect
{
// first get the cell to draw inside our bounds
// then draw a focus ring if that's appropriate
}
In the NSButtonCell subclass (OurButtonCell):
- (void)drawInteriorWithFrame: (NSRect) rect inView: (NSView *) controlView
{
// a bunch of drawing code
}
The Timeline view in Versions is actually a WebView, the page that you see in it uses javascript to collapse headers you click on.
The rule of thumb I use for where to start out with a custom control is:
To customize the look of a standard Cocoa control:
subclass the appropriate control (like e.g. NSButton and NSButtonCell)
stick as close as makes sense to the way the default control is implemented (e.g. in a buttoncell, start from the existing attributedTitle instance method to draw the button title, unless you always want to draw with the same attributes regardless of what's set up in IB or if you need to draw with different attributes based on state, such as with the trial expiration button in Versions' main window)
Creating an entirely new UI element:
subclass NSView and implement pretty much all mouse and key event handling (within the view, no need to redo "hitTest:") and drawing code yourself.
To present something that's complex, of arbitrary height, but isn't a table:
See if you can do it in HTML, CSS and JS and present it in a WebView.  The web is great at laying out text, so if you can offload that responsibility to your WebView, that can be a huge savings in pain in the neck.
Recommended reading on learning how to draw stuff in your own custom view's drawing methods: Cocoa Drawing Guide
Customizing the look of for instance an NSTableView is an entirely other cup of tea, thanks to the complexity of a tableview, that can happen all over the place.  You'll be implementing your own custom cells for some things you want to do in a table, but will have to change the way rows are highlighted in a subclass of the actual NSTableView object itself.  See for instance the source code for iTableView on Matt Gemmell's site for a clear example of where to draw what.
Finally, I think Abizer's suggestion to go check out the code of BWToolkit is a great idea.  It might be a bit overwhelming at first, but if you can read and understand that code you'll have no trouble implementing your own custom views and controls.
Have a look at some excellent example code: BWToolkit