Android Studio：預覽和模擬器模式之間的佈局差異

我只是新的潛入Android應用程序開發世界並最近創建了我的第一個計算器應用程序。當我運行在模擬器上的應用程序，我看到了一個問題，即沒有在預覽模式佈局和一個在模擬器模式之間的差異，你可以看到如下：Android Studio：預覽和模擬器模式之間的佈局差異

這裏是我content_main.xml文件：

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:showIn="@layout/activity_main" 
    tools:context="com.example.sonduong.calculator.MainActivity"> 

    <TextView 
     android:id="@+id/textView3" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="of" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="181dp" 
     tools:layout_editor_absoluteY="255dp" /> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="%" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="300dp" 
     tools:layout_editor_absoluteY="207dp" /> 

    <EditText 
     android:id="@+id/numberTxt" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:ems="10" 
     android:hint="Enter Number" 
     android:inputType="numberDecimal" 
     android:textAlignment="center" 
     tools:layout_editor_absoluteX="85dp" 
     tools:layout_editor_absoluteY="296dp" /> 

    <TextView 
     android:id="@+id/totalTextView" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:text="0" 
     android:textAlignment="center" 
     android:textSize="36sp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" 
     app:layout_constraintVertical_bias="0.101" /> 

    <TextView 
     android:id="@+id/textView" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="What is" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="152dp" 
     tools:layout_editor_absoluteY="129dp" /> 

    <EditText 
     android:id="@+id/percentageTxt" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:ems="10" 
     android:hint="Enter Percentage" 
     android:inputType="numberDecimal" 
     android:textAlignment="center" 
     tools:layout_editor_absoluteX="85dp" 
     tools:layout_editor_absoluteY="193dp" /> 

    <Button 
     android:id="@+id/calcBtn" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="CALCULATE" 
     tools:layout_editor_absoluteX="147dp" 
     tools:layout_editor_absoluteY="374dp" /> 

</android.support.constraint.ConstraintLayout>

然而，在這個xml文件我也得到了一些錯誤，他們看起來像：

任何人都可以幫助我如何調整預覽和模擬器之間的相同視圖。謝謝！

來源

2017-08-05 Sonn

根據您的需要調整。

替換您XML這個XML

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

<TextView 
    android:id="@+id/textView3" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="of" 
    android:textSize="24sp" 
    android:layout_marginLeft="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    android:layout_marginRight="8dp" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintHorizontal_bias="0.501" 
    android:layout_marginBottom="92dp" 
    app:layout_constraintBottom_toTopOf="@+id/numberTxt" /> 

<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="%" 
    android:textSize="24sp" 
    android:layout_marginRight="8dp" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintBaseline_toBaselineOf="@+id/percentageTxt" 
    android:id="@+id/textView2" /> 

<EditText 
    android:id="@+id/numberTxt" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:ems="10" 
    android:hint="Enter Number" 
    android:inputType="numberDecimal" 
    android:textAlignment="center" 
    android:layout_marginLeft="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    android:layout_marginRight="8dp" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintHorizontal_bias="0.505" 
    android:layout_marginBottom="0dp" 
    app:layout_constraintBottom_toTopOf="@+id/calcBtn" /> 

<TextView 
    android:id="@+id/totalTextView" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:text="0" 
    android:textAlignment="center" 
    android:textSize="36sp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintTop_toTopOf="parent" 
    app:layout_constraintHorizontal_bias="0.0" 
    android:layout_marginTop="8dp" /> 

<TextView 
    android:id="@+id/textView" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="What is" 
    android:textSize="24sp" 
    android:layout_marginLeft="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    android:layout_marginRight="8dp" 
    app:layout_constraintRight_toRightOf="parent" 
    android:layout_marginTop="8dp" 
    app:layout_constraintTop_toBottomOf="@+id/totalTextView" 
    app:layout_constraintHorizontal_bias="0.502" /> 

<EditText 
    android:id="@+id/percentageTxt" 
    android:layout_width="0dp" 
    android:layout_height="wrap_content" 
    android:ems="10" 
    android:hint="Enter Percentage" 
    android:inputType="numberDecimal" 
    android:textAlignment="center" 
    android:layout_marginLeft="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    app:layout_constraintRight_toLeftOf="@+id/textView2" 
    android:layout_marginRight="8dp" 
    app:layout_constraintHorizontal_bias="0.0" 
    android:layout_marginBottom="8dp" 
    app:layout_constraintBottom_toTopOf="@+id/textView3" 
    android:layout_marginTop="8dp" 
    app:layout_constraintTop_toBottomOf="@+id/textView" /> 

<Button 
    android:id="@+id/calcBtn" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="CALCULATE" 
    android:layout_marginLeft="8dp" 
    app:layout_constraintLeft_toLeftOf="parent" 
    android:layout_marginRight="8dp" 
    app:layout_constraintRight_toRightOf="parent" 
    app:layout_constraintBottom_toBottomOf="parent" 
    android:layout_marginBottom="9dp" 
    app:layout_constraintHorizontal_bias="0.502" />

來源

2017-08-05 09:54:56

非常有用..非常感謝..... –

OK，你需要使用linear layout與重量做到這一點,,試試這個代碼..

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout android:layout_height="match_parent" 
    android:layout_width="match_parent" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:orientation="vertical" 
    android:weightSum="7" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools"> 

    <TextView 
     android:id="@+id/textView3" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:text="of" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="181dp" 
     tools:layout_editor_absoluteY="255dp" /> 

    <TextView 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:text="%" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="300dp" 
     tools:layout_editor_absoluteY="207dp" /> 

    <EditText 
     android:id="@+id/numberTxt" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:ems="10" 
     android:hint="Enter Number" 
     android:inputType="numberDecimal" 
     android:textAlignment="center" 
     tools:layout_editor_absoluteX="85dp" 
     tools:layout_editor_absoluteY="296dp" /> 

    <TextView 
     android:id="@+id/totalTextView" 
     android:layout_width="0dp" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:text="0" 
     android:textAlignment="center" 
     android:textSize="36sp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" 
     app:layout_constraintVertical_bias="0.101" /> 

    <TextView 
     android:id="@+id/textView" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:text="What is" 
     android:textSize="24sp" 
     tools:layout_editor_absoluteX="152dp" 
     tools:layout_editor_absoluteY="129dp" /> 

    <EditText 
     android:id="@+id/percentageTxt" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1"  android:ems="10" 
     android:hint="Enter Percentage" 
     android:inputType="numberDecimal" 
     android:textAlignment="center" 

     tools:layout_editor_absoluteX="85dp" 
     tools:layout_editor_absoluteY="193dp" /> 

    <Button 
     android:id="@+id/calcBtn" 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 

     android:text="CALCULATE" 
     tools:layout_editor_absoluteX="147dp" 
     tools:layout_editor_absoluteY="374dp" /> 

</LinearLayout>

來源

2017-08-05 10:02:24

Android Studio：預覽和模擬器模式之間的佈局差異

回答

相關問題