无法更改 FBSDKLoginKit 中登录按钮的高度？

Question

我在 iOS 中使用 FBSDKLoginKit 和 Swift。

直到最近它一直运行良好，但是我现在无法覆盖 Storyboard 中按钮的高度？

出于某种原因，按钮的高度现在小了很多。我已经尝试为按钮设置高度限制，将按钮放在堆栈视图中并设置为按比例填充，甚至在 SDK 中覆盖按钮高度，但没有成功。

如果我将按钮更改为普通按钮 UIButton，布局约束将完美运行。

这是我运行应用程序时按钮的样子。

这就是我希望按钮的外观 - 大小合适。

Answer 1

作为最后的手段，尝试实现您自己的自定义按钮作为 Facebook 登录按钮。他们可能会阻止从 SDK 自定义按钮。 https://developers.facebook.com/docs/swift/login -- 这里有一节包含示例代码 - "Custom Login Button"。看起来并不复杂。

Answer 2

我也运行遇到过这个问题。 4.18.0 to 4.19.0 upgrade guide:

中解释了这样做的原因

The FBSDKLoginButton UI has changed in 4.19.0. Instead of "Log in with Facebook", the button now displays "Continue with Facebook". The button color is changed to #4267B2 from #3B5998. The button height is now fixed at 28 due to use of smaller font size and paddings around a larger Facebook logo.

到目前为止我发现的唯一解决方法是 将 SDK 版本降级到 4.18.0（它为我完成了工作）。

FB 可能会在 SDK 的未来更新之一中解决这个问题（...他们为很多人创建的）。

为了更持久的解决方案，我们可以看到 specific changes that caused this, on GitHub. The change I find most suspicious starts on line 194:

[self addConstraint:[NSLayoutConstraint constraintWithItem:self
                                                 attribute:NSLayoutAttributeHeight
                                                 relatedBy:NSLayoutRelationEqual
                                                    toItem:nil
                                                 attribute:NSLayoutAttributeNotAnAttribute
                                                multiplier:1
                                                  constant:28]];

如果上面的约束是removed/disabled，就可以帮助扭转局面。它应该看起来大致像这样（在撰写本文时我手头没有 IDE）：

// Obtain all constraints for the button:
let layoutConstraintsArr = fbLoginButton.constraints
// Iterate over array and test constraints until we find the correct one:
for lc in layoutConstraintsArr { // or attribute is NSLayoutAttributeHeight etc.
   if ( lc.constant == 28 ){
     // Then disable it...
     lc.active = false
     break
   }
}

当我有机会测试以上内容或找到更好的解决方案时，我会更新答案。

Answer 3

我们遇到了同样的问题。我们通过使用 initWithFrame 方法在代码中创建按钮来解决这个问题。

来自文档

FBSDKLoginButton has a fixed height of @c 30 pixels, but you may change the width. initWithFrame:CGRectZero will size the button to its minimum frame.

这个解决方案对我们有用

let facebookButton = FBSDKLoginButton(frame:facebookButtonPlaceholder.bounds)
facebookButton.readPermissions = ["email"]
facebookButton.backgroundColor = UIColor.clear
facebookButtonPlaceholder.addSubview(facebookButton)
facebookButtonPlaceholder.backgroundColor = UIColor.clear

Answer 4

至于现在 Facebook 按钮只有一个约束，即高度约束，您可以删除按钮的所有约束并添加您的约束。

facebookSignInButton.removeConstraints(facebookSignInButton.constraints)

当然，这在未来可能会发生变化，您可能会删除不想要的限制。也许更好的解决方案是只删除那个有问题的约束。

if let facebookButtonHeightConstraint = facebookSignInButton.constraints.first(where: { [=11=].firstAttribute == .height }) {
    facebookSignInButton.removeConstraint(facebookButtonHeightConstraint)
}

Answer 5

所以我采用了@Dev-iL 的解决方案并将其调整为更适合未来的东西。我对此很陌生，所以我花了几个小时才弄明白，但我想我会分享，因为它专门根据高度约束而不是基于常量值来停用高度约束。

我在故事板中使用了一个分类为 Facebook 按钮的子视图，并在那里设置了新的约束。

我更喜欢这种方法，觉得它更简洁。

注意：我相信对于高度限制，它始终是第一个值，但是如果我错了请纠正我，我会通过编辑进行更新。正如我提到的，我是新手

编辑：我决定包含常量值 28，以允许在删除过程中跳过故事板高度限制。如果您在删除后以编程方式添加约束，则不需要这样做

for const in fbLoginButton.constraints{
  if const.firstAttribute == NSLayoutAttribute.height && const.constant == 28{
    fbLoginButton.removeConstraint(const)
  }
}

Answer 6

您可以通过简单地覆盖 facebook 按钮来方便地实现这一点。

Swift:

class FacebookButton: FBSDKLoginButton {

    override func updateConstraints() {
        // deactivate height constraints added by the facebook sdk (we'll force our own instrinsic height)
        for contraint in constraints {
            if contraint.firstAttribute == .height, contraint.constant < standardButtonHeight {
                // deactivate this constraint
                contraint.isActive = false
            }
        }
        super.updateConstraints()
    }

    override var intrinsicContentSize: CGSize {
        return CGSize(width: UIViewNoIntrinsicMetric, height: standardButtonHeight)
    }

    override func imageRect(forContentRect contentRect: CGRect) -> CGRect {
        let logoSize: CGFloat = 24.0
        let centerY = contentRect.midY
        let y: CGFloat = centerY - (logoSize / 2.0)
        return CGRect(x: y, y: y, width: logoSize, height: logoSize)
    }

    override func titleRect(forContentRect contentRect: CGRect) -> CGRect {
        if isHidden || bounds.isEmpty {
            return .zero
        }

        let imageRect = self.imageRect(forContentRect: contentRect)
        let titleX = imageRect.maxX
        let titleRect = CGRect(x: titleX, y: 0, width: contentRect.width - titleX - titleX, height: contentRect.height)
        return titleRect
    }

}

在此代码示例中，standardButtonHeight 是具有所需按钮高度的已定义常量。

另请注意，24.0 的徽标大小与 SDK 4.18 版中使用的大小相同。

Answer 7

我可以通过这种方式改变按钮的高度：

我在情节提要中添加了一个视图 facebookButtonView 并具有我想要的大小，然后在 viewDidLoad 中我简单地执行此操作：
```
let loginButton = LoginButton(frame: self.facebookButtonView.frame, readPermissions: [ .publicProfile ])
self.view.addSubview(loginButton)
```

Facebook 按钮采用与 facebookButtonView 相同的大小。我用高度 50 进行了测试，它可以正常工作。

Answer 8

意识到这是一个老问题，我找到了解决方案并将其作为答案发布以供将来参考。

通过 Pod 安装 FBSDKLoginKit 后，查看 XCODE 左侧的目录并打开 PODS -- 而不是 Podfile。打开 FBSDKLoginKit，然后打开 FBSDKLoginButton.m 文件。

您现在会看到一条提示，表明您正在编辑。忽略警报，即注意消息并确保除了目标信息之外没有更改任何内容。更改文件中指示 Facebook 按钮高度的两个字段，如下所示：

帮助您完成上述指南的图片：

project structure files to open
first field to change
second field to change

最简单的解决方案，无需处理编程矩形，只需在故事板中处理

Answer 9

Swift 4.0 中的这个小自动闭包也可以完美地工作，如果您没有理由删除约束，只需覆盖它即可。

let facebookLoginButton = FBSDKLoginButton()
if let constraint = facebookLoginButton.constraints.first(where: { (constraint) -> Bool in
    return constraint.firstAttribute == .height
}) {
    constraint.constant = 40.0
}

或者如果你讨厌 let 语句：

let facebookLoginButton = FBSDKLoginButton()
facebookLoginButton.constraints.first(where: { (constraint) -> Bool in
    return constraint.firstAttribute == .height
})?.constant = 40.0

Answer 10

Autolayout 不再适用于 Facebook 按钮 (FBSDKButton)。我使用按钮框架更改了它的高度。

    let fbLoginbutton = FBSDKLoginButton()

    view.addSubview(fbLoginbutton)

    fbLoginbutton.frame = CGRect(x: 38, y: 397, width: 300, height: 38)

您可以根据自己的需要进行设置。虽然我仍然无法更改其字体和徽标大小。

Answer 11

如果您只是在更改按钮的高度之后，在故事板中添加按钮后，您可以简单地调整按钮上已经存在的高度约束的常量：

for constraint in facebookButton.constraints where constraint.firstAttribute == .height {
    constraint.constant = YOUR_Height
}

这段代码可以放在viewDidLoad().

Answer 12

Xamarin.iOS 使用 Linq 的示例。

我在故事板文件中创建了按钮，并在那里指定了高度。但是，我不能只删除所有高度限制，因为我在情节提要中设置的高度限制也被删除了。我必须检查是否存在尺寸为 28 的现有高度限制 - 并删除那个

var contraint = this.FacebookLoginButton?.Constraints?.Where(x => x.FirstAttribute.Equals(NSLayoutAttribute.Height) && x.Constant == 28f)?.FirstOrDefault() ?? null;
if (contraint != null)
{
  this.FacebookLoginButton.RemoveConstraint(contraint);
}

无法更改 FBSDKLoginKit 中登录按钮的高度？

Cannot change the height of Login Button in FBSDKLoginKit?

ios

swift

storyboard

facebook-login

facebook-ios-sdk