iPhone stretchableImageWithLeftCapWidth only makes “D”s

这一生的挚爱 提交于 2019-11-30 02:24:43
kennytm

A stretchable image is divided into 9 parts, if both leftCapWidth and topCapHeight are nonzero.

     leftCapWidth
      <----->
      +--------------+ ^
      |     | |      | |
      |  A  | |  B   | | topCapHeight
      |-----+·+------| v
      |-----+·+------|
      |  C  | |  D   |
      |     | |      |
      +--------------+

The central parts are always 1 px in size, and this is the part that is stretched, for example:

     leftCapWidth (constant!)
      <----->
      +------------------+ ^
      |     |     |      | |
      |  A  |     |  B   | | topCapHeight (constant!)
    v |-----+ - - +------| v
    | |     .     .      |
    | |     .     .      |
    ^ |-----+ - - +------|
      |  C  |     |  D   |
      |     |     |      |
      +------------------+
            >-----<
        stretched region

To create a "glass pill button", you should fill the rounded border into the regions A, B, C and D above, and supply the radius of that pill into both the leftCapWidth and topCapHeight.


Also, a stretchable image is not shrinkable. If you try to use stretchable images bigger than the buttons (or whatever else) you want to apply it to, they may be rendered incorrectly (especially on older iOSes).

Rolf Hendriks

stretchableImageWithLeftCapWidth does not behave as you would expect. I suggest using UIView's contentStretch property instead to save yourself some frustration.

FYI, the way stretchableImage behaves is:

  • if you shrink the image, it just clips the top and left parts of the image rather than stretching anything.
  • if you expand the image, it will expand only the column of pixels just beneath the top cap and the row of pixels just right of the left cap. This works for very simple graphics but will look awkward for any graphics that have effects like shading or gloss.

contentStretch, on the other hand, behaves just as you would expect. The graphic basically gets split into 9 parts that expand AND CONTRACT the way Kenny explained.

Also, don't forget that anytime you stretch a view, its contentMode should be set to UIViewContentModeScaleToFill.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!