UIButton上的backgroundImage錯誤地縮放

Question

當用戶按下按鈕然后設置寬度動畫時，我試圖給我的UIButton一個新的背景圖像。 問題是按鈕沒有縮放圖像（我只使用視網膜圖像）。

點擊之前：

點擊后：

以及使事情發生的代碼：

UIImage *buttonProfileDefault = [[UIImage imageNamed:@"Profile_Button_Default"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 3, 3, 3)];
        [self.profileButton setBackgroundImage:buttonProfileDefault forState:UIControlStateNormal];

[self.profileButton removeConstraint:self.profileButtonConstraint];

// Animate
CGRect originalFrame = self.profileButton.frame;
originalFrame.size.width = 40;
[UIView animateWithDuration:0.2f
    animations:^{
        self.profileButton.frame = originalFrame;
    }
        completion:^(BOOL finished) {
    }];

Answer 1

試試這個代碼......

    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:1.0];
    [self.profileButton setBackgroundImage:[UIImage imageNamed:@"Profile_Button_Default"] forState:UIControlStateNormal];
    [self.profileButton setBackgroundImage:[UIImage imageNamed:@"Profile_Button_Default"] forState:UIControlStateSelected];
    [self.profileButton setFrame:CGRectMake(self.profileButton.frame.origin.x, self.profileButton.frame.origin.y, self.profileButton.frame.size.width + 40, self.profileButton.frame.size.height)];
    [UIView commitAnimations];

我希望這能幫到你......

Answer 2

創建邊緣插入的方式將使最左邊的3個和最右邊的3個（或像素）保持不變，並且它會拉伸按鈕上的頭部。 如果你想讓頭部的大小保持不變，你必須將它包含在左側，留下1個像素可拉伸，然后是右側。 假設你的圖片寬度為50，你會寫：

UIImage * buttonProfileDefault = [[UIImage imageNamed:@"Profile_Button_Default"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 46, 3, 3)];

但是，這會使您的圖片位於按鈕的左側。 我推薦的解決方案是使用2張圖片：

1. 僅包含按鈕邊框的可調整大小的圖像，設置為按鈕的背景圖像
2. 僅包含頭部的圖像，設置為具有恆定大小的按鈕圖像

代碼看起來像：

UIImage *backgroundImage = [[UIImage imageNamed:@"border.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 3, 3, 3)]; // in this case you can use 3, 3, 3, 3

[self.profileButton setBackgroundImage:backgroundImage forState:UIControlStateNormal];

UIImage *titleImage = [UIImage imageNamed:@"head.png"];

[self.profileButton setImage:titleImage forState:UIControlStateNormal];

希望這可以幫助！

Answer 3

我已經修改了以下幾點的代碼：

• 提供了圖像Profile_Button_Default.png（或.jpg等）的完整名稱，
• 為正常情況添加圖像狀態，這些效果將不會出現在觸摸按鈕的開始

現在檢查：

UIImage *buttonProfileDefault = [[UIImage imageNamed:@"Profile_Button_Default.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 3, 3, 3)];
[self.profileButton setBackgroundImage:buttonProfileDefault forState:UIControlStateNormal];
[self.profileButton setBackgroundImage:buttonProfileDefault
                              forState:UIControlStateSelected];
[self.profileButton setBackgroundImage:buttonProfileDefault forState:UIControlStateHighlighted];

[self.profileButton removeConstraint:self.profileButtonConstraint];

// Animate
CGRect originalFrame = self.profileButton.frame;
originalFrame.size.width = 40;
[UIView animateWithDuration:0.2f
                 animations:^{
                     self.profileButton.frame = originalFrame;
                 }
                 completion:^(BOOL finished) {
                 }];

Answer 4

我認為問題是你改變背景然后調整大小。

讓它使用自動布局的關鍵是為widthConstraint常量值設置動畫，並在動畫中設置背景圖像。

例如，我的視圖名稱按鈕上有一個按鈕 ，我有一個名為buttonWidth的寬度約束的IBOutlet - 下面是我的buttonPress的代碼：

UIImage *imageButton = [[UIImage imageNamed:@"button"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 10, 0, 10)];

[UIView animateWithDuration:0.01f
                 animations:^{
                     [self.button setBackgroundImage:imageButton forState:UIControlStateNormal];
                 }
                 completion:^(BOOL finished) {
                     [UIView animateWithDuration:1.0f
                                      animations:^{
                                          self.buttonWidth.constant = 300;
                                          [self.view layoutIfNeeded];
                                      }
                                      completion:^(BOOL finished) {
                                      }];


                 }];

正如您在上面的代碼中看到的那樣，使其適用於我的關鍵是在動畫中設置按鈕背景，出於某種原因，如果我在動畫之外更改背景圖像，則在動畫完成之前它將無法正確設置。

使用autoLayout時設置框架對我來說也不起作用，所以我為約束常量設置了動畫

Answer 5

試試這個，而不是將圖像指定為

UIImage *buttonProfileDefault = [[UIImage imageNamed:@"Profile_Button_Default"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 3, 3, 3)];

做這個

UIImage *buttonProfileDefault = [UIImage imageNamed:@"Profile_Button_Default"];

無需設置resizableImageWithCapInsets的約束。

Answer 6

我有同樣的問題，但它發生在我的應用程序加載時，我在檢查器中弄亂了button的屬性，如果你向下滾動並autoresize subviews檢查autoresize subviews它可能會工作，它對我autoresize subviews ！ 祝好運！

Answer 7

在使用筆尖時，我有類似的情況調整子視圖的大小。 不確定你是不是，但解決我的問題的是在我的各種觀點中取消選中“使用Autolayout”。

希望能解決您的問題。

布蘭登

Answer 8

您是否可以復制圖像並將其調整為正確的按鈕大小？

在這篇文章中查看IWasRobbed的答案。

他有一個很好的功能，並聲稱他的按鈕使用這種方法。