2017-01-01 74 views
-1

我是Android開發新手,我無法理解爲什麼它不按照所需的輸出工作。
下面顯示了所需的輸出和輸出以及ml佈局。RelativeLayout或LinearLayout?

Desired output

enter image description here

Achieved output

enter image description here

佈局

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:id="@+id/activity_main" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 

tools:context="com.caringhumans.rds.caringhumans.MainActivity"> 
<ImageView 
    android:id="@+id/logo" 
    android:src="@drawable/logo" 
    android:layout_width="28dp" 
    android:layout_height="28dp" 
    android:layout_toLeftOf="@+id/caring"/> 

<TextView 
    android:id="@+id/caring" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Caring Humans" 
    android:layout_alignParentTop="true" 
    android:layout_centerHorizontal="true" 
    android:textSize="25sp" 
    android:textColor="#f70f59"/> 
<ImageView 
    android:id="@+id/child" 
    android:src="@drawable/child" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_below="@+id/caring"/> 
    <TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Campaign" 
    android:textColor="#f70f59" 
    android:textSize="22sp" 
    android:layout_below="@+id/child"/> 
    </RelativeLayout> 
+0

RelativeLayout,它將幫助您稍後支持多種屏幕尺寸 –

回答

0

LinearLayouts用於放置您的觀點。線性SH猿,無論是在一排或一列。
後者似乎是你以後的樣子。

當您想以非線性方式放置視圖的位置時,使用RelativeLayouts,而不是使用它們之間的關係(toRightOf,above或similar)。

+0

我想過使用LinearLayout,但後來我無法理解如何將文本「Caring Humans」居中並將徽標放在它之前。 –

+0

要「將徽標放在它之前」,您可以使用**複合可繪製**(圖像將在** TextView內**,並且您可以擺脫ImageView-less視圖,更好的性能)。要將TextView的內容與中心對齊,您可以使用'android:gravity =「center」'。 –

0

爲了使ImageView的真正「包裝」的形象在你身邊正在顯示您需要添加這兩個屬性

android:scaleType="fitXY" 
android:adjustViewBounds="true" 

文檔:https://developer.android.com/reference/android/widget/ImageView.ScaleType.html

如父佈局在這裏,你或許應該使用LinearLayouts(您將需要添加到它們android:orientation="vertical"作爲默認的一個是水平的)

0

將您的代碼更改爲:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 

    tools:context="com.caringhumans.rds.caringhumans.MainActivity"> 
<ImageView 
android:id="@+id/logo" 
android:src="@drawable/logo" 
android:layout_width="28dp" 
android:layout_height="28dp" 
android:layout_toLeftOf="@+id/caring"/> 

<TextView 
android:id="@+id/caring" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="Caring Humans" 
android:layout_alignParentTop="true" 
android:layout_centerHorizontal="true" 
android:textSize="25sp" 
android:textColor="#f70f59"/> 
<ImageView 
android:id="@+id/child" 
android:src="@drawable/child" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_above="@+id/text" 
android:layout_below="@+id/caring"/> 
<TextView 
android:id="@+id/text" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="Campaign" 
android:textColor="#f70f59" 
android:textSize="22sp" 
android:layout_alignParentBottom="true"/> 
    </RelativeLayout> 
1

試試這個

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <TextView 
     android:id="@+id/logo" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:drawableLeft="@drawable/logo" 
     android:gravity="center" 
     android:text="Caring Humans" 
     android:textColor="#f70f59" 
     android:textSize="25sp" /> 

    <ImageView 
     android:id="@+id/child" 
     android:layout_width="match_parent" 
     android:layout_height="200dp" 
     android:layout_below="@+id/logo" 
     android:adjustViewBounds="true" 
     android:scaleType="center" 
     android:src="@drawable/child" /> 

    <TextView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/child" 
     android:paddingLeft="20dp" 
     android:paddingRight="20dp" 
     android:text="Campaign" 
     android:textColor="#f70f59" 
     android:textSize="22sp" /> 
</RelativeLayout> 

問題是與圖像試圖修復這一點,你的問題就可以解決。

+0

謝謝,你的代碼工作得很好,只有改變我爲解決圖像而添加android:scaleType =「fitXY」。 –

+0

謝謝....請接受答案,如果這對你有用。 –

0

將以下兩個標籤添加到ID爲'child'的ImageView可以解決您的問題。

android:scaleType="fitXY" 
android:adjustViewBounds="true" 

FitXY規模使用圖像填充 ,你需要設置adjustViewBounds到真正調整它的界限,以保持其繪製的長寬比。

0
<ImageView 
android:id="@+id/child" 
android:src="@drawable/child" 
android:layout_width="wrap_content" 
android:scaleType="centerCrop" 
android:adjustViewBounds="true" 
android:layout_height="256dp" 
android:layout_below="@+id/caring"/> 

這將幫助您實現所需的佈局。根據您的需要增加圖像的高度。 :)