制約レイアウトを使用したvideoViewでのボタンの整列

Question

私はSnapchatのような2つのボタンが下にあり、背景レイヤー上で小さなビデオが再生されるようなログイン画面を作っています。私がすべてをやったとき、ボタンはエミュレータ全体に行き渡る位置には位置付けられず、ビデオプレーヤーも位置がずれています。

ログインページのコードは、私はあなたの代わりにRelativeLayoutを使うべきだと思う

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context="com.example.test.test.Login"> 

<Button 
    android:id="@+id/btnSignUp" 
    android:layout_width="414dp" 
    android:layout_height="89dp" 
    android:text="SIGN UP" 
    android:textSize="40sp" 
    android:textStyle="bold" 
    android:background="#FFD54F" 
    android:textColor="#FAFAFA" 
    tools:layout_editor_absoluteX="-24dp" 
    tools:layout_editor_absoluteY="397dp" /> 

<Button 
    android:id="@+id/btnLogin" 
    android:layout_width="414dp" 
    android:layout_height="89dp" 
    android:fontFamily="sans-serif" 
    android:lineSpacingExtra="10sp" 
    android:text="Login" 
    android:textSize="40sp" 
    android:textStyle="bold" 
    android:background="#80DEEA" 
    android:textColor="#FAFAFA" 
    tools:layout_editor_absoluteX="-15dp" 
    tools:layout_editor_absoluteY="486dp" /> 

<VideoView 
    android:id="@+id/bgVideoView" 
    android:layout_width="394dp" 
    android:layout_height="410dp" 
    tools:layout_editor_absoluteX="-5dp" 
    tools:layout_editor_absoluteY="0dp" /> 
</android.support.constraint.ConstraintLayout> 

What I want it to look like

Emulator Capture

Answer 1

あなたは、ルート要素としてConstraintLayoutを使用していますが、あなたのサブビューには制約が与えられていません。あなたはこのような何かをしようとConstraintLayout使用する場合：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <Button 
     android:id="@+id/btnSignUp" 
     android:layout_width="0dp" 
     android:layout_height="89dp" 
     android:background="#FFD54F" 
     android:text="SIGN UP" 
     android:textColor="#FAFAFA" 
     android:textSize="40sp" 
     android:textStyle="bold" 
     app:layout_constraintBottom_toTopOf="@+id/btnLogin" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     tools:ignore="HardcodedText" 
     tools:layout_editor_absoluteX="-24dp" 
     tools:layout_editor_absoluteY="397dp" /> 

    <Button 
     android:id="@+id/btnLogin" 
     android:layout_width="414dp" 
     android:layout_height="89dp" 
     android:background="#80DEEA" 
     android:lineSpacingExtra="10sp" 
     android:text="Login" 
     android:textColor="#FAFAFA" 
     android:textSize="40sp" 
     android:textStyle="bold" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     tools:ignore="HardcodedText" 
     tools:layout_editor_absoluteX="-15dp" 
     tools:layout_editor_absoluteY="486dp" /> 

    <VideoView 
     android:id="@+id/bgVideoView" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:visibility="visible" 
     app:layout_constraintBottom_toTopOf="@+id/btnSignUp" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintTop_toTopOf="parent" /> 
</android.support.constraint.ConstraintLayout> 

ConstraintLayoutは、より進歩し、RelativeLayoutからflexableです。ここから、それについての詳細を学ぶ試してみてください。

Build a Responsive UI with ConstraintLayout

Answer 2

以下の通りです。以下 参照のサンプル実装：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.example.test.test.Login"> 

    <FrameLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
     <VideoView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" /> 
    </FrameLayout> 
    <LinearLayout 
     android:orientation="vertical" 
     android:layout_alignParentBottom="true" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 
     <Button 
      android:id="@+id/btnSignUp" 
      android:layout_width="414dp" 
      android:layout_height="89dp" 
      android:text="SIGN UP" 
      android:textSize="40sp" 
      android:textStyle="bold" 
      android:background="#FFD54F" 
      android:textColor="#FAFAFA" /> 

     <Button 
      android:id="@+id/btnLogin" 
      android:layout_width="414dp" 
      android:layout_height="89dp" 
      android:fontFamily="sans-serif" 
      android:lineSpacingExtra="10sp" 
      android:text="Login" 
      android:textSize="40sp" 
      android:textStyle="bold" 
      android:background="#80DEEA" 
      android:textColor="#FAFAFA" 
      /> 
    </LinearLayout> 

</RelativeLayout>