web-dev-qa-db-ja.com

UIViewControllerのナビゲーションバーの中央に画像を配置する方法

このコードスニペットは、UIViewControllerのviewDidLoadで使用されています。エラーはありません。画像が存在します。背景は取得できますが、画像は取得できません。画像は一種のロゴです。

if ([self.navigationController.navigationBar respondsToSelector:@selector(setBackgroundImage:forBarMetrics:)] ) {

    /* Background of navigationBar. */
    UIImage * navigationBarImage = [UIImage imageNamed:@"01_navbar_portrait.png"];
    [self.navigationController.navigationBar setBackgroundImage:navigationBarImage forBarMetrics:UIBarMetricsDefault];

    /* Image in navigationBar */
    UIImage * logoInNavigationBar = [UIImage imageNamed:@"01_logo.png"];
    UIImageView * logoView = [[UIImageView alloc] init];
    [logoView setImage:logoInNavigationBar];
    self.navigationController.navigationItem.titleView = logoView;

}
22
sensorario

UINavigationControllerは、ナビゲーションスタックの最上位のビューコントローラーのnavigationItemプロパティを調べることにより、ナビゲーションバーを管理します。したがって、ビューをロゴに変更するには、ロゴを使用するビューコントローラー(つまり、ルートビューコントローラーまたはスタックにプッシュされる別のコントローラー)でこれを設定する必要があります。

ビューコントローラーのviewDidLoadで次のようにします。

UIImage* logoImage = [UIImage imageNamed:@"logo.png"];
self.navigationItem.titleView = [[UIImageView alloc] initWithImage:logoImage];

あなたの場合、間違ったナビゲーション項目を設定しています:

// Oops...
self.navigationController.navigationItem.titleView = logoView;
// Should be this:
self.navigationItem.titleView = logoView;
54
jhabbott

まず、ナビゲーションバーと同じサイズのビューを作成してから、画像ビューを追加し、フレームをナビゲーションバーの中央に表示されるように設定します。すべてのiOSバージョンで機能し、デバイスごとにフレームサイズを自動的に取得します(網膜または通常)、魔法のように動作します。

UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 320, 44);

UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Header.png"]];
imgView.frame = CGRectMake(75, 0, 150, 44);
imgView.contentMode = UIViewContentModeScaleAspectFit;

[headerView addSubview:imgView];

navigationCtrl.navigationBar.topItem.titleView = headerView;

[headerView release];
[imgView release];
9
AG29

迅速:

var logoImage:UIImage = UIImage(named: "logo_text")!
self.navigationItem.titleView = UIImageView(image: logoImage)
7
Esqarrouth
extension UINavigationController {
func addLogoImage(image: UIImage, navItem: UINavigationItem) {
    let imageView = UIImageView(image: image)
    imageView.contentMode = .scaleAspectFit
    imageView.translatesAutoresizingMaskIntoConstraints = false

    let view = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 44))
    view.addSubview(imageView)

    navItem.titleView = view
    imageView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
    imageView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
    imageView.heightAnchor.constraint(equalTo: view.heightAnchor).isActive = true
    imageView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true

    view.heightAnchor.constraint(equalTo: navigationBar.heightAnchor).isActive = true
    view.centerXAnchor.constraint(equalTo: navigationBar.centerXAnchor).isActive = true
    view.centerYAnchor.constraint(equalTo: navigationBar.centerYAnchor).isActive = true
}
}

これが私が使っているものです。

もちろん、左右のバーボタンアイテムと衝突しないように、もう少し制約が必要になるかもしれません。

3
Andrew

おそらくあなたが意図したものではないかもしれませんが、ナビゲーションバーに中央の背景画像を提供する方法を探してこのページに出くわしました。そのためにここに...ここに1つの方法があります。

別の答え を少し盗んで、画像を前景と背景に分割してから、背景を引き伸ばして前景を中央に配置する新しい画像を作成し、それをナビゲーションバーの背景画像として設定できます。イメージの構築は次のように機能します。

// build an image by stretching the bg, then merging it with the fg
CGSize barSize = self.navController.navigationBar.frame.size;
UIImage *fg = [UIImage imageNamed:@"some_fg"];
UIImage *bg = [[UIImage imageNamed:@"some_bg"]
               resizableImageWithCapInsets:UIEdgeInsetsMake(0.f,1.f,0.f,1.f)];
UIGraphicsBeginImageContextWithOptions(barSize, NO, 0.0);
[bg drawInRect:CGRectMake(0, 0, barSize.width, barSize.height)];
[fg drawInRect:CGRectMake((barSize.width-fg.size.width)/2.f,
                          0,
                          fg.size.width,
                          fg.size.height)];
// grab the merged images
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
2
beOn

フレームを指定するだけです

logoView.frame = CGRectMake(initialize frame here);

次に、以下を使用します

[self.navigationItem setTitleView:logoView];
1
manujmv
func centeredNavBarImage (){
    let navcontroller = navigationController!
    let image = #imageLiteral(resourceName: "yourImage")
    let imageView = UIImageView(image:image)

    let bannerWidth = navcontroller.navigationItem.accessibilityFrame.size.width
    let bannerHeight = navcontroller.navigationBar.frame.size.height


    let bannerX = bannerWidth / 2 - image.size.width / 2
    let bannerY = bannerHeight / 2 - image.size.height / 2

    imageView.frame = CGRect(x: bannerX, y: bannerY, width: bannerWidth, height: bannerHeight)
    imageView.contentMode = .scaleAspectFit

    navigationItem.titleView = imageView

}

これは https://youtu.be/bLkuu_fmls から変更されたコードです

BannerWidthでは、ナビゲーションバーの右側にある更新ボタンの項目が考慮されます。動作するようです。

ViewDidLoadで関数を実行します

0
Steve B