如何复制 iOS 键盘外观? [英] How do I replicate the iOS keyboard appearance?
问题描述
我为我的 iOS 应用制作了一个自定义数字键盘，但希望它更接近标准键盘的外观.我正在寻找有关如何使标准 UIButton 外观和行为类似于标准键盘按钮的建议.
I have made a custom number pad keypad for my iOS app, but want it to more closely mirror the appearance of the standard keyboard. I am looking for advice on how to make a standard UIButton look and act like the standard keyboard buttons.
具体来说，我需要为 iPad 弄清楚以下内容，并希望在 xib 或情节提要中做尽可能多的事情.
Specifically, I need to figure out the following for the iPad and would like to do as much as possible in an xib or storyboard.
- 按钮的大小
- 键盘背景的颜色(或者更好，我如何自己确定?)
- 按钮的背景颜色
- 按钮中文字的字体和颜色
- 如何在按钮下方添加阴影?
- 如何使用灰色而不是蓝色突出显示按钮?
- 按钮之间的间距
- 如何在更改方向时使按钮组"作为一个整体居中?(所有调整大小的选项都将其固定在一边，而不是相互固定)
标准按钮使用图像，还是修改标准 UIButton?或者更恰当地说，哪个对我们更好?
Do the standard buttons use images, or do they modify standard UIButton's? Or more appropriately, which is better for us to do?
更新:
我为数字键盘创建了一个项目，这是一个完整的工作示例.但是，我并没有花太多时间在实际外观上，这就是这个问题的主要内容.我已将其发布在 Github 上，并使其成为一个开源项目(受 MIT 许可证涵盖，因此也允许商业用途).希望其他人会发现它有用，并希望其他人会愿意帮助它变得更好，看起来更像原生键盘.Github 存储库位于:
UPDATE:
I have created a project for the number pad which is a complete working example. However, I have not spent much time on the actual appearance, which is what this question was mainly about. I have posted it on Github and made it an open source project (covered by the MIT licence, so commercial use is allowed as well). Hopefully other people will find it useful, and hopefully others will feel inclined to help make it better and look more like the native keyboard. The Github repository is at:
https://github.com/lnafziger/Numberpad
推荐答案
如果你想主要在 IB 中做，那么可以做到以下几点:
If you want to do it mostly in IB, then the following can be done:
- 尺寸
- 颜色
- 背景颜色
- 字体
- 文字颜色
- 阴影(对 UILabel 不是 UITextArea)
- 间距
- 自动调整大小
有一个很酷的 PSD 矢量工具包适用于所有类型的 iOS 元素，应该会有所帮助:
There is a cool PSD vector kit for all types of iOS elements that should help:
http://www.smashingmagazine.com/2008/11/26/iphone-psd-vector-kit/
无论如何，对于其余的答案:
Anyway, to the rest of the answers:
对按钮进行截图并在 Photoshop 中确定大小，或者您可以在图像文件上使用 CMD+i 查看像素尺寸.记得使用 CMD+Shift+4 然后拖动(然后空格来截屏).
Take a screenshot of the buttons and determine the size in Photoshop, or you can use CMD+i on the image file to see the pixel dimensions. Remember to use CMD+Shift+4 and then drag (and then Space to make the screenshot).
使用预装在 Mac 上的 DigitalColor Meter 应用，各种功能都非常棒.
Use the DigitalColor Meter app that's preinstalled on the Mac, it's pretty cool for all kinds of functions.
实际的 UIButton 将具有 [UIColor clear] 的背景颜色，但是，对于整个键盘背景，最好在 Photoshop 中创建类似的内容，然后再次使用颜色选择器来获取正确的渐变.然后你可以把它作为背景图片拖到 IB 中.
The actual UIButton will have a background color of [UIColor clear], however, for the whole keyboard background, it would be best to create something similar in Photoshop and again using color pickers to get the right gradients. Then you could drag this into IB as a background image.
再次，看看字体/试试 Helvetica
Again, have a look at fonts/try Helvetica
[UIColor black]
阴影:
以编程方式:
[text setShadowOffset:(0,1)]; // One option
[text setShadowOffset:(0,-1); // Another option
[text setShadowColor:[UIColor whiteColor]];
但是，您也可以在 IB 检查器中为 UILabel 设置阴影.
But, you can also set the shadow in the IB inspector for a UILabel.
查看 UIButton 参考http://developer.apple.com/库/ios/#documentation/UIKit/Reference/UIButton_Class/UIButton/UIButton.html
Look at the UIButton reference http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UIButton_Class/UIButton/UIButton.html
如果您使用 IB，那么您只需将按钮拖到任何位置即可.IB 有一些自动调整大小的选项，可根据 TOP、LEFT、RIGHT 和 BOTTOM 确定按钮的间距.您还可以设置它们是否可拉伸.
If your using IB, then you could just drag on the buttons to whatever location.. IB has some autosizing options that determine where the buttons are spaced according to the TOP, LEFT, RIGHT and BOTTOM. You can also set if they are stretchable or not.
这篇关于如何复制 iOS 键盘外观?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
