Geek asks and answers

How to reproduce the look of an iOS keyboard?

I created a special keyboard with a keyboard for my iOS application, but I want it to more accurately reflect the look of a standard keyboard. I am looking for tips on how to make a standard UIButton image and act like standard keyboard buttons.

In particular, I need to figure out the following for the iPad and do as much as possible in xib or storyboard.

  • Button Size
  • Keyboard background color (or even better, how can I determine this myself?)
  • Button background color
  • Font and color of the text in the button
  • How to add a shadow under a button?
  • How can I highlight a button with gray instead of blue?
  • Button Spacing
  • How to save a “group” of buttons centered as a whole when changing orientation? (all resizing options bind it to the side, and not to each other).

Do they use standard image buttons or change standard UIButton? Or in a more appropriate way, what is better for us to do?

UPDATE:
I created a project for the numeric keypad, which is a complete working example. However, I did not spend much time on the actual appearance, and this was the main question. I posted it on Github and made it an open source project (which is licensed by MIT, so commercial use is allowed). I hope other people find this useful, and hopefully others will feel inclined to help make it better and more like a native keyboard. The Github repository is located at:

https://github.com/lnafziger/Numberpad

+3
source share
1

IB, :

  • ( UILabel UITextArea)
  • Spacing
  • Autosizing

PSD iOS, :

http://www.smashingmagazine.com/2008/11/26/iphone-psd-vector-kit/

, :

Photoshop, CMD + , . CMD + Shift + 4, ( , ).

DigitalColor Meter, Mac, .

UIButton

UIButton [UIColor clear], - Photoshop , . IB .

, / Helvetica

[UIColor black]

:

:

[text setShadowOffset:(0,1)]; // One option
[text setShadowOffset:(0,-1); // Another option
[text setShadowColor:[UIColor whiteColor]];

IB UILabel.

UIButton http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UIButton_Class/UIButton/UIButton.html

IB, . IB , , TOP, LEFT, RIGHT BOTTOM. , .

+6

More articles:


All Articles