菜鸟教程小白 发表于 2022-12-12 13:46:05

iOS 11 导航栏/uibarbutton 项目渲染问题


                                            <p><p>我正在尝试向左侧添加多个 <code>UIBarButtonItem</code> 项目，并在右侧添加一个。这在 iOS10 上运行良好，但 iOS11 似乎已经破坏了它。</p>

<p>这都是用 Xamarin 编写的，但是类/方法名称等几乎都映射起来了，所以随心所欲地回答。</p>

<p>当使用最简单的方法添加两个按钮时，直接在按钮上设置图像/ Action ，我只得到两个中的一个，而且它很大，居中，我的标题丢失了:</p>

<pre><code>var leftMenuBarBackBtn = new UIBarButtonItem(UIImage.FromBundle(&#34;arrowBackButton&#34;), UIBarButtonItemStyle.Plain, leftBackButtonTap);
var leftMenuBarItem = new UIBarButtonItem(UIImage.FromBundle(&#34;menu&#34;), UIBarButtonItemStyle.Plain, leftMenuButtonTap);
UIBarButtonItem[] navItems = {
    leftMenuBarBackBtn,
    leftMenuBarItem
};

var rightMenuBarItem = new UIBarButtonItem(UIImage.FromBundle(&#34;bell&#34;).ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), UIBarButtonItemStyle.Plain, rightMenuButtonTap);

NavigationItem.LeftItemsSupplementBackButton = false;
NavigationItem.LeftBarButtonItems = navItems;
NavigationItem.RightBarButtonItem = rightMenuBarItem;
</code></pre>

<p> <a href="/image/marFm.png" rel="noreferrer noopener nofollow"><img src="/image/marFm.png" alt="Simple approach"/></a> </p>

<hr/>

<p>以前我们创建 <code>UIImage</code> 项并将它们添加为自定义 View (请忽略可怕的做法，这是继承的):</p>

<pre><code>var leftBackBtn = new UIButton(UIButtonType.Custom);
leftBackBtn.SetImage(UIImage.FromBundle(&#34;arrowBackButton&#34;).ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), UIControlState.Normal);
leftBackBtn.Frame = new CGRect(0, 0, 27, 20);
leftBackBtn.ContentMode = UIViewContentMode.ScaleAspectFit;
leftBackBtn.TouchUpInside += leftBackButtonTap;
UIBarButtonItem leftMenuBarBackBtn = new UIBarButtonItem(leftBackBtn);

var leftMenuBtn = new UIButton(UIButtonType.Custom);
leftMenuBtn.SetImage(UIImage.FromBundle(&#34;menu&#34;).ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), UIControlState.Normal);
leftMenuBtn.Frame = new CGRect(0, 0, 27, 20);
leftMenuBtn.ContentMode = UIViewContentMode.ScaleAspectFit;
leftMenuBtn.TouchUpInside += leftMenuButtonTap;
UIBarButtonItem leftMenuBarItem = new UIBarButtonItem(leftMenuBtn);
UIBarButtonItem[] navItems = { leftMenuBarBackBtn, leftMenuBarItem };

var rightMenuBtn = new UIButton(UIButtonType.Custom);
rightMenuBtn.SetImage(UIImage.FromBundle(&#34;bell&#34;).ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), UIControlState.Normal);
rightMenuBtn.Frame = new CGRect(0, 0, 19, 22);
rightMenuBtn.ContentMode = UIViewContentMode.ScaleAspectFit;
rightMenuBtn.TouchUpInside += rightMenuButtonTap;
UIBarButtonItem righttMenuBarItem = new UIBarButtonItem(rightMenuBtn);
UIBarButtonItem[] navItems2 = { righttMenuBarItem };

this.NavigationItem.LeftBarButtonItems = navItems;
this.NavigationItem.RightBarButtonItems = navItems2;
</code></pre>

<p>我得到一个奇怪的、伸出的“后退”按钮和一个非常小的汉堡菜单:
<a href="/image/Lw5rv.png" rel="noreferrer noopener nofollow"><img src="/image/Lw5rv.png" alt="with custom views, stretched back"/></a> </p>

<hr/>

<p>最后，虽然我不同意，但我们的客户坚持使用自定义后退按钮。当我采用我认为正确的方法时，使用 native 后退按钮，它有点工作，我的标题 View 又回来了。这将作为权宜之计，但这并不是我们真正想要的用户体验:</p>

<pre><code>var leftMenuBarItem = new UIBarButtonItem(UIImage.FromBundle(&#34;menu&#34;), UIBarButtonItemStyle.Plain, leftMenuButtonTap);
var rightMenuBarItem = new UIBarButtonItem(UIImage.FromBundle(&#34;bell&#34;).ImageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), UIBarButtonItemStyle.Plain, rightMenuButtonTap);

NavigationItem.LeftItemsSupplementBackButton = true;

NavigationItem.LeftBarButtonItem = leftMenuBarItem;
NavigationItem.RightBarButtonItem = rightMenuBarItem;
</code></pre>

<p> <a href="/image/sslFt.png" rel="noreferrer noopener nofollow"><img src="/image/sslFt.png" alt="proper back button"/></a> </p>

<p>谢谢!</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>请参阅 <a href="https://stackoverflow.com/questions/44442573/navigation-bar-rightbaritem-image-button-bug-ios-11" rel="noreferrer noopener nofollow">UIBarButtonItem on iOS 11</a> </p>
<p><code>UIBarButtonItem</code> 使用自动布局而不是处理框架。</p>
<p>这就是按钮被拉伸(stretch)的原因。</p>
<h3>修改:</h3>
<pre><code>widthConstraint = leftBackBtn.WidthAnchor.ConstraintEqualTo(27);
heightConstraint = leftBackBtn.HeightAnchor.ConstraintEqualTo(20);
widthConstraint.Active = true;
heightConstraint.Active = true;
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于iOS 11 导航栏/uibarbutton 项目渲染问题，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/46408217/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/46408217/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: iOS 11 导航栏/uibarbutton 项目渲染问题