web-dev-qa-db-ja.com

UIViewのサブビューを中央に配置する方法

UIViewmの中にUIViewがあり、幅と高さをサイズ変更することなく、内側のUIViewを常に外側のものの中央に配置したいのですが。

サイズ変更を設定せずに、上/左/右/下になるようにストラットとスプリングを設定しました。しかし、それはまだ中心ではありません。何か案が？

iphoneobjective-ciosipad
110
xonegirlz

Objective-C

yourSubView.center = CGPointMake(yourView.frame.size.width  / 2, 
                                 yourView.frame.size.height / 2);

Swift

yourSubView.center = CGPoint(x: yourView.frame.size.width  / 2,
                             y: yourView.frame.size.height / 2)
181
happy pig

これを行うことができ、常に機能します：

child.center = [parent convertPoint:parent.center fromView:parent.superview];

Swiftの場合：

child.center = parent.convert(parent.center, from:parent.superview)
268
Hejazi

始める前に、原点がビューの左上隅CGPointであることを思い出してください。ビューと親について理解する重要なこと。

このシンプルなコードを見てみましょう。ビューに黒い四角を追加するView Controllerです：

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        createDummyView()
        super.view.backgroundColor = UIColor.cyanColor();
    }

    func createDummyView(){
        var subView = UIView(frame: CGRect(x: 15, y: 50, width: 50 , height: 50));
        super.view.addSubview(subView);
        view.backgroundColor = UIColor.blackColor()
    }

}

これにより、このビューが作成されます。黒い四角形の原点と中心は、親と同じ座標に適合します

enter image description here

ここで、subViewに別のSubSubViewを追加し、subSubviewをsubViewと同じOriginにしようとしますが、subSubViewをsubViewの子ビューにします。

このコードを追加します。

var subSubView = UIView();
subSubView.frame.Origin = subView.frame.Origin;
subSubView.frame.size = CGSizeMake(20, 20);
subSubView.backgroundColor = UIColor.purpleColor()
subView.addSubview(subSubView)

そして、これが結果です：

enter image description here

この行のため：

subSubView.frame.Origin = subView.frame.Origin;

紫の長方形のOriginは親（黒い長方形）と同じであると期待しますが、その下にあります。なぜですか？ビューを別のビューに追加すると、subViewフレーム「world」が親BOUND RECTANGLEになるため、メイン画面のOriginがすべてのサブビューの座標（15,15）にあるというビューがある場合、左上隅は（0,0）になります

これが、サブビューの「ワールド」であるバインドされた長方形で常に親を参照する必要がある理由です。この行を次のように修正します。

subSubView.frame.Origin = subView.bounds.Origin;

魔法を見てください。subSubviewは親Originに正確に配置されています。

enter image description here

それで、あなたは「OK私は私の意見を両親の意見だけに集中させたかったのですが、大したことは何ですか？」まあ、それは大したことではありません、あなたはちょうどこれを行うことにより、そのフレームから親の境界の中心に取られる親の中心点を「変換」する必要があります：

subSubView.center = subView.convertPoint(subView.center, fromView: subSubView);

あなたは実際に彼に「両親のビューセンターを取り、それをsubSubViewの世界に変換する」と言っています。

そして、この結果が得られます：

enter image description here

33
Daniel Krom

私は使うだろう：

self.childView.center = CGPointMake(CGRectGetMidX(self.parentView.bounds),
                                    CGRectGetMidY(self.parentView.bounds));

CGRectオプションを使用したい...

スウィフト3：

self.childView.center = CGPoint(x: self.parentView.bounds.midX,
                                        y: self.parentView.bounds.midY);
26
theprojectabot

1.自動レイアウトを有効にしている場合：

  • ヒント：自動レイアウトを使用してビューを別のビューの中央に配置するには、少なくとも1つの親ビューを共有する2つのビューに同じコードを使用できます。

まず、子ビューの自動サイズ変更を無効にします

UIView *view1, *view2;
[childview setTranslatesAutoresizingMaskIntoConstraints:NO];

  1. UIView + Autolayoutまたは Purelayout の場合：

    [view1 autoAlignAxis:ALAxisHorizontal toSameAxisOfView:view2];
[view1 autoAlignAxis:ALAxisVertical toSameAxisOfView:view2];

  2. UIKitレベルの自動レイアウトメソッドのみを使用している場合：

    [view1 addConstraints:({
    @[ [NSLayoutConstraint
       constraintWithItem:view1
       attribute:NSLayoutAttributeCenterX
       relatedBy:NSLayoutRelationEqual
       toItem:view2
       attribute:NSLayoutAttributeCenterX
       multiplier:1.f constant:0.f],

       [NSLayoutConstraint
        constraintWithItem:view1
        attribute:NSLayoutAttributeCenterY
        relatedBy:NSLayoutRelationEqual
        toItem:view2
        attribute:NSLayoutAttributeCenterY
        multiplier:1.f constant:0.f] ];
})];

2.自動レイアウトなし：

私が好む：

UIView *parentView, *childView;
[childView setFrame:({
    CGRect frame = childView.frame;

    frame.Origin.x = (parentView.frame.size.width - frame.size.width) / 2.0;
    frame.Origin.y = (parentView.frame.size.height - frame.size.height) / 2.0;

    CGRectIntegral(frame);
})];
20
Cemal Eker

最も簡単な方法：

child.center = parent.center
12
juancazalla

enter image description here

この自動サイズ変更マスクを内部ビューに設定します。

8
Mayank Jain

IOS9では、レイアウトアンカーAPIを使用できます。

コードは次のようになります。

childview.centerXAnchor.constraintEqualToAnchor(parentView.centerXAnchor).active = true
childview.centerYAnchor.constraintEqualToAnchor(parentView.centerYAnchor).active = true

CGPointMakeまたはCGRectに対するこれの利点は、これらのメソッドではビューの中心を定数に設定しますが、この手法では、parentviewがどのように変化しても、永久に保持される2つのビュー間の関係を設定することです。

これを行う前に確認してください：

        self.view.addSubview(parentView)
        self.view.addSubView(chidview)

また、各ビューのtranslatesAutoresizingMaskIntoConstraintsをfalseに設定します。

これにより、クラッシュとAutoLayoutの干渉が防止されます。

7
Roymunson

使用できます

yourView.center = CGPointMake(CGRectGetMidX(superview.bounds), CGRectGetMidY(superview.bounds))

そしてSwift 3.0で

yourView.center = CGPoint(x: superview.bounds.midX, y: superview.bounds.midY)
7
Sayali Shinde

ビューとサブビューで同じ中心を使用するのが最も簡単な方法です。このようなことができます

UIView *innerView = ....;
innerView.view.center = self.view.center;
[self.view addSubView:innerView];
5
codeFood

PureLayout を使用する別のソリューションは、autoCenterInSuperviewを使用します。

// ...
UIView *innerView = [UIView newAutoLayoutView];
innerView.backgroundColor = [UIColor greenColor];
[innerView autoSetDimensionsToSize:CGSizeMake(100, 30)];

[outerview addSubview:innerView];

[innerView autoCenterInSuperview];

これは次のようなものです。

Center with PureLayout

4
H6.

私は使うだろう：

child.center = CGPointMake(parent.bounds.height / 2, parent.bounds.width / 2)

これはシンプルで、短く、甘いものです。上記の@Hejaziの回答を使用し、parent.centerが(0,0)以外に設定されている場合、サブビューは中央に配置されません。

1
Old Name
func callAlertView() {

    UIView.animate(withDuration: 0, animations: {
        let H = self.view.frame.height * 0.4
        let W = self.view.frame.width * 0.9
        let X = self.view.bounds.midX - (W/2)
        let Y = self.view.bounds.midY - (H/2)
        self.alertView.frame = CGRect(x:X, y: Y, width: W, height: H)
        self.alertView.layer.borderWidth = 1
        self.alertView.layer.borderColor = UIColor.red.cgColor
        self.alertView.layer.cornerRadius = 16
        self.alertView.layer.masksToBounds = true
        self.view.addSubview(self.alertView)

    })


}// calculation works adjust H and W according to your requirement
0
Sidd Redkar

C＃またはXamarin.iosでは、次のように使用できます

imageView.Center = new CGPoint（tempView.Frame.Size.Width/2、tempView.Frame.Size.Height/2）;

0
Anisetti Nagendra