Problems faced while customizing NSTextFieldCell - cocoa

I am trying to make cells in an outline view just like we have for users in Skype's message window.
For this I created a custom class:
IconNameCell.h
#interface IconNameCell : NSTextFieldCell {
//#private
NSImage *userImage; // size (17,17)
NSImage *statusIcon; // size (14,14)
NSString *cellText;
}
#property (readwrite, retain) NSImage *userImage;
#property (readwrite, retain) NSImage *statusIcon;
#property (readwrite, retain) NSString *cellText;
- (void)drawWithFrame:(NSRect)cellFrame inView:(NSView *)controlView;
#end
IconNameCell.m
#implementation IconNameCell
#synthesize userImage;
#synthesize statusIcon;
#synthesize cellText;
- (void)drawWithFrame:(NSRect)cellFrame inView:(NSView *)controlView{
#try{
// Inset the cell frame to give everything a little horizontal padding
NSRect anInsetRect = NSInsetRect(cellFrame,2.0,0);
//FIXME: flip coordinates and size can be set in accessor methods
// setting userImage and statusIcon in flipped coordinate
[userImage setFlipped:YES];
[statusIcon setFlipped:YES];
// setting size of image and icon
[userImage setSize:NSMakeSize(25.0, 25.0)];
[statusIcon setSize:NSMakeSize(15.0, 17.0)];
// setting attributes of cell text
NSMutableParagraphStyle *dParagraphStyle = [[NSMutableParagraphStyle alloc] init];
[dParagraphStyle setAlignment:NSLeftTextAlignment];
NSColor *colorOfText;
if ([self isHighlighted]) {
colorOfText = [NSColor whiteColor];
}
else {
colorOfText = [NSColor blackColor];
}
NSMutableDictionary * dTitleAttributes = [[NSMutableDictionary alloc] initWithObjectsAndKeys:
colorOfText,NSForegroundColorAttributeName,
[NSFont systemFontOfSize:11.0],NSFontAttributeName,
dParagraphStyle, NSParagraphStyleAttributeName,
nil];
// getting sizes
NSSize cellTextSize = [cellText sizeWithAttributes:dTitleAttributes];
NSSize userImageSize = [userImage size];
NSSize statusIconSize = [statusIcon size];
// making layout boxes for all elements
// vertical padding between the lines of text
float dVerticalPadding = 2.0;
// horizontal padding between two images
float padBtwnImgs = 4.0;
// horizontal padding between image and text
float padBtwnImgText = 6.0;
NSString *userImageName = [userImage name];
NSLog(#"userImageName - %# / cellText- %#",userImageName,cellText); // getting null for userImageName
//if ([userImageName isEqualToString:#"current_D.png"]) {
//FIXME: this is juggad and should be corrected
NSRange rangeOfComma = [cellText rangeOfString:#","];
if (rangeOfComma.length !=0 ) {
//<#statements#>
// userImage box: center the userImage vertically inside of the inset rect
NSRect cellTitleBox = NSMakeRect(anInsetRect.origin.x,
anInsetRect.origin.y + anInsetRect.size.height*.5 - cellTextSize.height*.5,
cellTextSize.width,
cellTextSize.height);
// drawing cell text
[cellText drawInRect:cellTitleBox withAttributes:dTitleAttributes];
}
else {
// userImage box: center the userImage vertically inside of the inset rect
NSRect userImageBox = NSMakeRect(anInsetRect.origin.x,
anInsetRect.origin.y + anInsetRect.size.height*.5 - userImageSize.height*.5,
userImageSize.width,
userImageSize.height);
// statusIcon box: center the statusIcon vertically inside of the inset rect
NSRect statusIconBox = NSMakeRect(userImageBox.origin.x + userImageBox.size.width + padBtwnImgs,
anInsetRect.origin.y + anInsetRect.size.height*.5 - statusIconSize.height*.5,
statusIconSize.width,
statusIconSize.height);
// cellTitleBox: vertically aligning text
NSRect cellTitleBox = NSMakeRect(statusIconBox.origin.x + statusIconBox.size.width + padBtwnImgText,
anInsetRect.origin.y + anInsetRect.size.height*.5 - cellTextSize.height*.5,
cellTextSize.width,
cellTextSize.height);
// drawing user image
[userImage drawInRect:userImageBox fromRect:NSZeroRect operation:NSCompositeSourceOver fraction:1.0];
// drawing user status
[statusIcon drawInRect:statusIconBox fromRect:NSZeroRect operation:NSCompositeSourceOver fraction:1.0];
// drawing cell text
[cellText drawInRect:cellTitleBox withAttributes:dTitleAttributes];
}
}
#catch (NSException *e) {
NSLog(#"IconNameCell -%#",e);
}
}
#end
2nd, I assigned text field cell for outline view the class: IconNameCell in IB
3rd, I used this code in delegate to set image, icon and name of user in custom cell-
- (void)outlineView:(NSOutlineView *)outlineView willDisplayCell:(id)cell forTableColumn:(NSTableColumn *)tableColumn item:(id)item{
if ([[tableColumn identifier] isEqualToString:#"userInfo"]) {
// some relevant code
if( [[item onlineStatus] intValue] == 0 ){
[cell setStatusIcon:[NSImage imageNamed:#"offline.png"]];
}
else{
[cell setStatusIcon:[NSImage imageNamed:#"online.png"]];
}
//similarly, setting attribute for userImage and cellText
}
I am facing two problems with it: 1. Application is frequently crashing when I am selecting one or the other row in outline view. Earlier when I had not taken the customized cell but three different columns for - user image, user status and user name it was working fine! 2. For the log: NSLog(#"userImageName - %# / cellText- %#",userImageName,cellText); I am getting (null) as userImageName, although I should get some string value for it.
Can anyone suggest me some solution for it??
Thanks,
Miraaj

Application is frequently crashing when I am selecting one or the other row in outline view.
Please edit your question to include the crash log.
2. For the log: NSLog(#"userImageName - %# / cellText- %#",userImageName,cellText); I am getting (null) as userImageName, although I should get some string value for it.
Have you set the image's name with setName: or obtained it from imageNamed:? Otherwise, it doesn't have one, and this output is correct.

Related

Shadow in NSScrollView in Mac OS X app

I need two things similar to Pages app in my Mac OS X app. Please view the attached screen shot.
I need a shadow on NSScrollView as shown in Mac OS X Pages app.
I want my scroll bar to be like the one in Mac OS X Pages app.
A quick and easy way of getting the top shadow is to override the enclosing clip view. This is not ideal however, because it draws the shadow (actually a gradient) behind the controls. I find it good enough.
#import <Cocoa/Cocoa.h>
// DFInvertedClipView.h
IB_DESIGNABLE
#interface DFInvertedClipView : NSClipView
#property IBInspectable BOOL shouldDrawTopShadow;
#end
// DFInvertedClipView.m
#import "DFInvertedClipView.h"
#interface DFInvertedClipView ()
#property CGFloat startAlpha;
#end
#implementation DFInvertedClipView
- (BOOL) isFlipped {
return true;
}
-(void) drawRect:(NSRect)dirtyRect
{
[super drawRect:dirtyRect];
if (_shouldDrawTopShadow) {
NSGradient * gradient = [[NSGradient alloc] initWithStartingColor:[NSColor colorWithCalibratedWhite:0.6 alpha:self.startAlpha]
endingColor:[NSColor colorWithCalibratedWhite:0.6 alpha:0.0]];
NSRect b = [self bounds];
NSRect topFade = NSMakeRect(NSMinX(b), NSMinY(b), NSWidth(b), 5.0);
[gradient drawInRect:topFade angle:90];
NSBezierPath *topLine = [NSBezierPath bezierPath];
[topLine moveToPoint:NSMakePoint(NSMinX(self.bounds), NSMinY(self.bounds))];
[topLine lineToPoint:NSMakePoint(NSMaxX(self.bounds), NSMinY(self.bounds))];
CGFloat lineWidth = [[NSScreen mainScreen] backingScaleFactor];
[topLine setLineWidth:lineWidth];
[[NSColor colorWithCalibratedWhite:0.5 alpha:self.startAlpha] setStroke];
[topLine stroke];
}
}
-(void) scrollToPoint:(NSPoint)newOrigin
{
[super scrollToPoint:newOrigin];
// Grade the shadow darkness based on the displacement from a flush fit
CGFloat displacementForFullShadow = 40.0; // pixels
if (newOrigin.y > 0) {
CGFloat alpha = 1.0/displacementForFullShadow * newOrigin.y; // e.g. linear grade function y = m*x + c (m = 1/displacementForFullShadow, c = 0.0)
if (alpha > 1.0) {
alpha = 1.0;
}
self.startAlpha = alpha;
} else {
self.startAlpha = 0.0;
}
}
The shadow of the view above is achieved by setting custom CALayer options of this view (you'll be probably interested in mask-property). Just check the View Effects Inspector from the IB (or you can do it programmatically too - read this)
To remove scroll view knobs' light style open NSScrollView attributes inspector in IB and select Scroller Knobs style to "Default Style" (second line).

UIImageView filling entire UICollectionView cell

I have a UICollectionView displaying a horizontal layout of images. Under each image, I'm displaying a label. In the storyboard, I've extended the height of the cell so that the label will be displayed underneath the cell. I've also set the height of the UIImageView in storyboard to be 20pts less than the cell. However, no matter what I do, the images take up the entire cell and the label is displayed on top of the image. Should I be setting the size of the imageview elsewhere? I found this thread which I thought would help since it's basically, identical, but the solution did not help me.
Here is my code...
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"Cell"; // string value identifier for cell reuse
ImageViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.layer.borderWidth = 1.0;
cell.layer.borderColor = [UIColor grayColor].CGColor;
NSString *myPatternString = [self.imageNames objectAtIndex:indexPath.row];
cell.imageView.image = [self.imagesArray objectAtIndex:indexPath.row];
cell.imageView.contentMode = UIViewContentModeScaleAspectFill;
cell.imageView.clipsToBounds = YES;
CGSize labelSize = CGSizeMake(CellWidth, 20);
UILabel *testLabel = [[UILabel alloc] initWithFrame:CGRectMake(cell.bounds.size.width/2, cell.bounds.size.height-labelSize.height, cell.bounds.size.width, labelSize.height)];
testLabel.text = myPatternString;
[cell.contentView addSubview:testLabel];
return cell;
}
Don't know if this will work for you, but I do this will a subclass of UIView which contains two subviews -- a UIImageView for the image and a UILabel for the label. Here is the essence of that subclass below (don't be bothered by the rounding of bottoms; in some areas I need the bottoms to be rounded, in others I don't). I just add this subview to the contentView of the cell. Don't know if it helps you but here it is. BTW, imageView is a class variable here but you might define it as a property.
- (id)initWithFrame:(CGRect)frame withImage:(UIImage *)img withLabel:(NSString *)lbl roundBottoms:(BOOL)roundBottoms;
{
self = [super initWithFrame:frame];
if (self)
{
imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, frame.size.width, frame.size.height-25.0f)];
if (roundBottoms)
{
imageView.layer.cornerRadius = 12;
imageView.layer.masksToBounds = YES;
}
else
{
CAShapeLayer * maskLayer = [CAShapeLayer layer];
maskLayer.path = [UIBezierPath bezierPathWithRoundedRect: imageView.bounds byRoundingCorners: UIRectCornerTopLeft | UIRectCornerTopRight cornerRadii: (CGSize){12.0, 12.}].CGPath;
imageView.layer.mask = maskLayer;
}
[imageView setImage:img];
imageView.contentMode = UIViewContentModeScaleAspectFill; // default
[self addSubview:imageView];
UILabel * label = [[UILabel alloc] initWithFrame:CGRectMake(0.0f, frame.size.height - 25.0f, frame.size.width, 25.0f)];
label.text = lbl;
labelText = lbl;
label.textAlignment = NSTextAlignmentCenter;
label.textColor = [UIColor blackColor];
label.adjustsFontSizeToFitWidth = YES;
label.minimumScaleFactor = 0.50f;
label.backgroundColor = [UIColor clearColor];
self.tag = imageItem; // 101
[self addSubview:label];
}
return self;
}
I have another version of it I use where I calculate the height of the label based on the overall frame height that is passed in. In this one, the cell sizes are static so the label heights can be as well.

Make text underlined in xcode

Hey I'm making an app that requires a certain part of a text view's text to be underlined. is there a simple way to do this like for making it bold and italics or must i make and import a custom font? thanks for the help in advance!
This is what i did. It works like butter.
1) Add CoreText.framework to your Frameworks.
2) import <CoreText/CoreText.h> in the class where you need underlined label.
3) Write the following code.
NSMutableAttributedString *attString = [[NSMutableAttributedString alloc] initWithString:#"My Messages"];
[attString addAttribute:(NSString*)kCTUnderlineStyleAttributeName
value:[NSNumber numberWithInt:kCTUnderlineStyleSingle]
range:(NSRange){0,[attString length]}];
self.myMsgLBL.attributedText = attString;
self.myMsgLBL.textColor = [UIColor whiteColor];
#import <UIKit/UIKit.h>
#interface TextFieldWithUnderLine : UITextField
#end
#import "TextFieldWithUnderLine.h"
#implementation TextFieldWithUnderLine
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}
- (void)drawRect:(CGRect)rect {
//Get the current drawing context
CGContextRef context = UIGraphicsGetCurrentContext();
//Set the line color and width
CGContextSetStrokeColorWithColor(context, [UIColor blackColor].CGColor);
CGContextSetLineWidth(context, 0.5f);
//Start a new Path
CGContextBeginPath(context);
// offset lines up - we are adding offset to font.leading so that line is drawn right below the characters and still characters are visible.
CGContextMoveToPoint(context, self.bounds.origin.x, self.font.leading + 4.0f);
CGContextAddLineToPoint(context, self.bounds.size.width, self.font.leading + 4.0f);
//Close our Path and Stroke (draw) it
CGContextClosePath(context);
CGContextStrokePath(context);
}
#end
Since iOS 6.0 UILabel, UITextField and UITextView support displaying attributed strings using the attributedText property.
Usage:
NSMutableAttributedString *aStr = [[NSMutableAttributedString alloc] initWithString:#"text"];
[aStr addAttribute:NSUnderlineStyleAttributeName value:NSUnderlineStyleSingle range:NSMakeRange(0,2)];
label.attributedText = aStr;

How to right set height of NSTableCellView with NSTextField?

Greets!
I have a View-based NSTableView with Custom View as a cell (NSTableCellView class).
There is NSTextField inside custom cell.
I need to display 3 lines of text inside NSTextField and after clicking on cell content must grow up to fit full text.
So, I need to increment height of NSTextField and height of NSCTableCellView by click in other words.
Alghoritm is:
Handle click on NSTableCellView
Calculate new sizes of NSTextField and NSTableCellView
SetFrameSize to NSTextField through IBOutlet
Store new NSTableCellView height value in class and invoke function "RowHeightChanged" through Notification Center
Set new row height from class value
This is a code snippet: (i erased some unusefull things)
TickCellTableView:
#implementation TickCellTableView
// Other Constants
#synthesize textFieldInitHeight = _textFieldInitHeight;
#synthesize rowHeight = _rowHeight;
#synthesize rowIndex = _rowIndex;
- (void)mouseDown:(NSEvent *)theEvent {
if (![self.superview isKindOfClass:[NSTableCellView class]])
[super mouseDown:theEvent];
CGFloat TextFieldFitHeight = [self getHeightForStringDrawing: self.textField.stringValue
withFont:[self.textField font]
forTextWidth:[self.textField frame].size.width + 10.0];
if ([self.textField frame].size.height < TextFieldFitHeight)
{
NSSize size = [self.textField frame].size;
size.height = TextFieldFitHeight;
[self.textField setFrameSize:size];
self.rowHeight = [self frame].size.height + (TextFieldFitHeight - _textFieldInitHeight);
[[NSNotificationCenter defaultCenter] postNotificationName:#"RowHeightChanged"
object:self.rowIndex];
}
}
#end
NSTableView Delegate:
#implementation DisplayTicksView
- (void)awakeFromNib
{
[[NSNotificationCenter defaultCenter] addObserver:self
selector:#selector(RowHeightChanged:)
name: #"RowHeightChanged"
object:nil];
}
-(void)RowHeightChanged:(NSNotification *)notification
{
NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:[notification.object integerValue]];
[tableView noteHeightOfRowsWithIndexesChanged:indexSet];
}
- (NSInteger)numberOfRowsInTableView:(NSTableView *)tableView
{
return [ticksArray count];
}
#end
The problem is when i clicked on the NSTextField it's frame grow up just for the second and return to init size, after that starts animation to set property height of cell.
In result - Cell height is up, but NSTextField none. I tried to disable animation - no result. How can i fix that?
Appologise my English :)

adding subviews to an NSView to have a chess-like grid

I am trying to create a Cocoa UI that consists of two sets of squares (chess-like grids) that will assume different colours while an underlying algorithm is running. When the execution of the algorithm comes to an end, the UI should be able to handle clicks, panning and other gestures.
The hierarchy I have so far is the following (please check the attached code for specifics):
1) the main window that is the window of a window controller
2) a split view with two custom views, mainView and sideView (each one would hold a set of squares)
3) two view controllers (mainViewController and sideViewController)
I would like to be able to load the squares as subviews of mainView and sideView.
I thought of having another custom view, say SquareView with another nib file. My questions would be:
a) how do I create this SquareView so that it can be used to create the squares that will be added to mainView and sideView as subviews to form chess-like grids?
b) how do I add subviews to mainView and sideView to built the two grids? For the sake of simplicity, let's assume there would be four non-overlapping squares for each of the previously mentioned views.
Thank you!
MainView.m
#import "MainView.h"
#implementation MainView
- (void)drawRect:(NSRect)TheRect
{
[[NSColor grayColor] set];
[NSBezierPath fillRect:[self bounds]];
}
SideView.m
#import "SideView.h"
#implementation MainView
- (void)drawRect:(NSRect)TheRect
{
[[NSColor whiteColor] set];
[NSBezierPath fillRect:[self bounds]];
}
MainWindowController.h
#import <Cocoa/Cocoa.h>
#class SideViewController;
#class MainViewController;
#interface MainWindowController : NSWindowController
{
IBOutlet NSSplitView* oMainSplitView;
SideViewController* sideViewController;
MainViewController* mainViewController;
}
#end
MainWindowController.m
#import "MainWindowController.h"
#import "SideViewController.h"
#import "MainViewController.h"
#implementation MainWindowController
- (void)windowDidLoad
{
sideViewController = [[SideViewController alloc] initWithNibName:#"SideView" bundle:nil];
NSView* splitViewLeftView = [[oMainSplitView subviews] objectAtIndex:0];
NSView* sideView = [sideViewController view];
[sideView setFrame:[splitViewLeftView bounds]];
[sideView setAutoresizingMask:(NSViewWidthSizable | NSViewHeightSizable)];
[splitViewLeftView addSubview:sideView];
mainViewController = [[MainViewController alloc] initWithNibName:#"MainView" bundle:nil];
NSView* splitViewRightView = [[oMainSplitView subviews] objectAtIndex:1];
NSView* mainView = [mainViewController view];
[mainView setFrame:[splitViewRightView bounds]];
[mainView setAutoresizingMask:(NSViewWidthSizable | NSViewHeightSizable)];
[splitViewRightView addSubview:mainView];
}
You can make this as simple or as complicated as you desire: simple? do everything you want in MainView's drawRect method; complex: nest NSViews (or NSCell's, or NSBox's, etc.) and have each one draw itself.
Personally, I'd vote to keep it simpleā€¦
a) I think the easiest way would be to create a matrix of NSBoxes, which you could do in code or in IB. Having the squares in a matrix would make it easy to loop through them or access specific ones.
b) I'm not sure what your question is here -- you would do it just as you did in your posted code, using [mainView addSubview:squareMatrix];
After Edit: Actually, it looks like IB won't let you embed NSBoxes in a matrix. In the past, I've made a matrix of subclassed NSButtonCells (to allow background color with no border) that had a grid of 64x64 cells that were clickable and would change color with those clicks. I don't know if you want a fixed number of cells in your views, or do you need to dynamically change the number? Something like this could work for you I think -- I actually created this in code, because IB was really slow in updating with that many cells.
Here is what I did. In my case, I needed cells with no border but with background color, so I had to subclass NSButtonCell, like this:
-(id)initWithRGBAlpha:(NSArray *)rgbAlpha {
if (self == [super init]) {
NSColor *color = [NSColor colorWithCalibratedRed:[[rgbAlpha objectAtIndex:0]doubleValue]
green:[[rgbAlpha objectAtIndex:1]doubleValue]
blue:[[rgbAlpha objectAtIndex:2]doubleValue]
alpha:[[rgbAlpha objectAtIndex:3]doubleValue]];
[self setBackgroundColor:color];
[self setTitle:#""];
[self setBordered:NO];
[self setTag:0];
[self setImageScaling:3];
return self;
}else{
return nil;
}
}
-(void) setState:(NSInteger)value {
if (value == 1) {
self.backgroundColor = self.selectedColor;
[super setState:value];
}else {
self.backgroundColor = self.backgroundColor;
[super setState:value];
}
}
-(void) setBackgroundColor:(NSColor *)color {
backgroundColor = color;
selectedColor = [color colorWithAlphaComponent:.75];
}
- (void)encodeWithCoder:(NSCoder *)encoder {
[super encodeWithCoder:encoder];
[encoder encodeObject:self.backgroundColor forKey:#"bColor"];
}
- (id)initWithCoder:(NSCoder *)decoder {
[super initWithCoder:decoder];
self.backgroundColor = [decoder decodeObjectForKey:#"bColor"];
return self;
}
I created the matrix in code, like so:
#implementation RDMatrix
-(void) initWithParentView:(NSView *) cv {
NSNumber *one = [NSNumber numberWithInt:1];
NSArray *colors = [NSArray arrayWithObjects:one,one,one,one,nil];
RDButtonCell *theCell = [[RDButtonCell alloc ]initWithRGBAlpha:colors];
[self initWithFrame:NSMakeRect(200,100,1,1) mode:2 prototype:theCell numberOfRows:64 numberOfColumns:64];
[self setSelectionByRect:TRUE];
[self setCellSize:NSMakeSize(8,8)];
[self sizeToCells];
self.target = self;
self.action = #selector(matrixClick:);
self.backgroundColor = [NSColor lightGrayColor];
self.drawsBackground = TRUE;
self.autoresizingMask = 8;
self.allowsEmptySelection = TRUE;
[cv addSubview:self];
}
-(void) matrixClick: (id) sender {
for (RDButtonCell *aCell in self.selectedCells){
if ([self.selectedCells count] < 64) {
aCell.backgroundColor = [NSColor colorWithCalibratedRed:1 green:0 blue:0 alpha:1];
}else{
aCell.backgroundColor = [NSColor colorWithCalibratedRed:0 green:.5 blue:1 alpha:1];
}
}
[self deselectAllCells];
}
#end

Resources