UIProgressView和自定义跟踪和进度图像（iOS 5属性） [英] UIProgressView and Custom Track and Progress Images (iOS 5 properties)

问题描述

我在iOS 5中尝试了一些关于 UIProgressView 的新属性。它们是：

@property（nonatomic，retain）UIImage * progressImage;

@property（nonatomic，retain）UIImage * trackImage;

这些新属性支持自定义进度和图片，以便您可以在不必自己滚动的情况下创建出色的进度条。

然而我不能理解苹果如何伸展进度图像，因为文档是一个小薄片/或有一些标准我不知道。 无论如何，我要问是否有人可以帮助我了解如何正确进行和跟踪图片。

我的自定义图片，无论我尝试哪种尺寸：

我的测量如下：

• UIProgressView长度： 226个单位


• 
  


• 
  
• 
  

  最后，这是我的自定义图片：

  
  
  

  progressImage.png

  
  
  

  trackImage.png

  解决方案

  这是发生了什么：

  
  
  

  您提供给 UIProgressView 基本上被插入到 UIImageViews 中，并且 UIImageView 正在拉伸图像以填充空间。

  
  
  

  如果你只是这样做：

    [progressView setTrackImage：[UIImage imageNamed：@ track.png]]; 
    

  然后你会得到奇怪的结果，因为它试图拉伸一个10px宽的图像填充（例如）100像素宽的图像视图。这意味着（粗略地）图像中的每个像素将被重复10次。因此，如果图片中的像素为：

    0123456789 
    

  然后将该图像直接放入100像素的宽图像视图中，将会展开如下：

    00000000001111111111222222222233333333334444444445555555555 ... 
    

  这是你发生了什么。

  
  
  

  你真的想要发生的是这样的：

    012345678123456781234567812345678123456781234567812345678 ... 123456789 
    

  换句话说，您希望图像具有1点左边缘从来没有拉伸，中心要平铺，并有1点右边缘，也从来没有拉伸。为此，您需要使图片可调整大小：

    UIImage * track = [[UIImage imageNamed：@track] resizableImageWithCapInsets：UIEdgeInsetsMake（0，1，0，1）]; 
   [progressView setTrackImage：track]; 
    

  如果你想要垂直平铺，那么边缘插入应该 {1,1,1,1} （假设您想要一个1点边框）。

  
  
  

  c $ c> progressImage ，你会得到正确的结果：

  
  
  
  
  
  

  tl; dr：

  
  
  

  您的图片需要调整大小。

  
  

  I am experimenting with some new properties in iOS 5 regarding UIProgressView. They are:

  @property(nonatomic, retain) UIImage *progressImage;
@property(nonatomic, retain) UIImage *trackImage;

  These new properties enable the customisation of the "progress" and the "track" image, so that you can make fancy progress bars without having to roll-your-own.

  I however cannot understand how Apple "stretches" the progress images, because documentation is a little flakey / OR there is some standard I am not aware of. Regardless, I am asking if someone can help me understand how to make appropriate progress and tracking images.

  I get results like this when I load my custom images, no matter which sizes I try:

  My measurements are as follows:

  • UIProgressView length: 226 units
  • trackingImage.png: 10px
  • progressImage.png: 7px

  Lastly, here are my custom images:

  progressImage.png

  trackImage.png

  解决方案

  Here's what's going on:

  The images you provide to the UIProgressView are basically being shoved in to UIImageViews, and the UIImageView is stretching the image to fill the space.

  If you simply do:

  [progressView setTrackImage:[UIImage imageNamed:@"track.png"]];
  

  Then you're going to get weird results, because it's trying to stretch a 10px wide image to fill (for example) a 100px wide image view. This means (roughly) that every pixel in the image will be repeated 10 times. So if the pixels in our image were:

  0123456789
  

  Then putting that image straight into a 100px wide image view would stretch it something like this:

  000000000011111111112222222222333333333344444444445555555555...
  

  This is what's happening to you.

  What you really want to have happen is this:

  01234567812345678123456781234567812345678...123456789
  

  In other words, you want the image to have a 1 point left edge that is never stretched, the center to be tiled, and to have a 1 point right edge that is also never stretched. To do this, you'll need to make the image resizable:

  UIImage *track = [[UIImage imageNamed:@"track"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 1, 0, 1)];
  [progressView setTrackImage:track];
  

  If you want this to tile appropriately vertically as well, then the edge insets should be {1, 1, 1, 1} (assuming you want a 1 point border).

  Do the same to the progressImage, and you'll end up with something that looks correct:

  tl;dr:

  Your images need to be resizable.

  这篇关于UIProgressView和自定义跟踪和进度图像（iOS 5属性）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！