想要在Android中顯示圖像和文本並排在Android

我是新來的android開發，我正在建立一個應用程序，並且我想在android佈局中並排顯示Imageview和Textview。下面的代碼顯示了imagview下面的textview。這裏我使用的是linearlayout。想要在Android中顯示圖像和文本並排在Android

在這個佈局中，我顯示了一些來自數據庫的數據。

預計的佈局設計：

Imageview Text1 
      Text2

代碼：

<?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="fill_parent" 
android:layout_height="fill_parent" 
tools:context="com.example.spand.krishnasoftwares.Main2Activity"> 
<RelativeLayout 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical" 
    android:background="@color/colorBackground"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical" 
     android:paddingTop="20px" 
     android:id="@+id/vly"> 
     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/imageView" 
      android:src="@drawable/gym_logo1"/> 
     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:orientation="horizontal" 
      android:id="@+id/ly1"> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Exercise 1" 
       android:textAlignment="center" 
       android:textAllCaps="true" 
       android:textColor="#ffffff" 
       android:layout_marginTop="20px" 
       android:textSize="10dp"/> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/ly1" 
      android:paddingLeft="5px" 
      android:paddingRight="5px" 
      android:id="@+id/ly2" 
      android:orientation="horizontal"> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Exercise Name:" 
       android:textColor="#ffffff" 
       android:layout_marginTop="20px" 
       android:layout_weight="1"/> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/en1" 
       android:textColor="#ffffff" 
       android:layout_marginTop="20px" 
       android:layout_weight="1"/> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/ly2" 
      android:id="@+id/ly3" 
      android:paddingLeft="5px" 
      android:paddingRight="5px" 
      android:orientation="horizontal"> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Speed: " 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/es1" 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/ly3" 
      android:paddingLeft="5px" 
      android:paddingRight="5px" 
      android:orientation="horizontal" 
      android:id="@+id/ly4"> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Repetition: " 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 

      <TextView 
       android:id="@+id/erep1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="10px" 
       android:layout_weight="1" 
       android:textColor="#ffffff" 
       android:textDirection="ltr" /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/erep2" 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/erep3" 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/ly4" 
      android:paddingLeft="5px" 
      android:paddingRight="5px" 
      android:orientation="horizontal" 
      android:id="@+id/ly5"> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="Weight: " 
       android:textColor="#ffffff" 
       android:layout_marginTop="10px" 
       android:layout_weight="1"/> 

      <TextView 
       android:id="@+id/ew1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_marginTop="10px" 
       android:layout_weight="1" 
       android:textColor="#ffffff" 
       android:textDirection="ltr" /> 

     </LinearLayout> 
    </LinearLayout> 



</RelativeLayout>

來源

2017-08-14 Mandeep Singh

不使用ConstraintLayout時使用嵌套佈局。你正在殺死ConstraintLayout的全部目的。 –

您還沒有添加鏈接到您的預期輸出 –

http://wiresareobsolete.com/2016/07/constraintlayout-part-1/學習本教程 –

選中此項。它會創建您想要的佈局視圖。

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:id="@+id/vly" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     android:paddingTop="20px" 
     android:weightSum="3"> 

     <ImageView 
      android:id="@+id/imageView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:src="@drawable/add" /> 

     <LinearLayout 
      android:id="@+id/ly" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="2" 
      android:orientation="vertical"> 


      <LinearLayout 
       android:id="@+id/ly1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal"> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="20px" 
        android:text="Exercise 1" 
        android:textAlignment="center" 
        android:textAllCaps="true" 
        android:textSize="10dp" /> 
      </LinearLayout> 

      <LinearLayout 
       android:id="@+id/ly2" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_below="@+id/ly1" 
       android:orientation="horizontal" 
       android:paddingLeft="5px" 
       android:paddingRight="5px"> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="20px" 
        android:layout_weight="1" 
        android:text="Exercise Name:" /> 

       <TextView 
        android:id="@+id/en1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="20px" 
        android:layout_weight="1" /> 
      </LinearLayout> 

      <LinearLayout 
       android:id="@+id/ly3" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_below="@+id/ly2" 
       android:orientation="horizontal" 
       android:paddingLeft="5px" 
       android:paddingRight="5px"> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:text="Speed: " /> 

       <TextView 
        android:id="@+id/es1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" /> 
      </LinearLayout> 

      <LinearLayout 
       android:id="@+id/ly4" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_below="@+id/ly3" 
       android:orientation="horizontal" 
       android:paddingLeft="5px" 
       android:paddingRight="5px"> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:text="Repetition: " /> 

       <TextView 
        android:id="@+id/erep1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 

        android:textDirection="ltr" /> 

       <TextView 
        android:id="@+id/erep2" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:textColor="#ffffff" /> 

       <TextView 
        android:id="@+id/erep3" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" /> 
      </LinearLayout> 

      <LinearLayout 
       android:id="@+id/ly5" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_below="@+id/ly4" 
       android:orientation="horizontal" 
       android:paddingLeft="5px" 
       android:paddingRight="5px"> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:text="Weight: " /> 

       <TextView 
        android:id="@+id/ew1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 

        android:textDirection="ltr" /> 

      </LinearLayout> 
     </LinearLayout> 

    </LinearLayout> 
</RelativeLayout>

來源

2017-08-14 09:32:04

謝謝，它像一個魅力upendra Shah –

歡迎，保持編碼.. :) –

你不能以這種方式使用ConstraintLayout，按照該代碼;

<LinearLayout 
    android:weightSum="2" 
    android:orientation="horizontal" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 


    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1"/> 


    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1"/> 

</LinearLayout>

來源

2017-08-14 08:38:35 alicanozkara

嗨alicanozkara，現在當我把額外的textview它並沒有顯示確切的是什麼我的要求是。 –

看起來像@ drawable/gym_logo1是@ + id/vly LinearLayout的android：orientation =「vertical」的孩子。你應該嘗試使它成爲@ + id/ly1的孩子

來源

2017-08-14 08:40:29

創建這樣的佈局它會爲你工作...但提醒一件事先搜索如果你沒有得到解決方案，然後問...

<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="fill_parent" 
android:layout_height="fill_parent" 
> 
<RelativeLayout 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" 
android:orientation="vertical" 
android:background="@color/colorBackground"> 
<ImageView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:id="@+id/imageView" 
    android:src="@drawable/gym_logo1"/> 
<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="vertical" 
    android:paddingTop="20px" 
    android:layout_toRightOf="@+id/imageView" 
    android:id="@+id/vly"> 

    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     android:id="@+id/ly1"> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Exercise 1" 
      android:textAlignment="center" 
      android:textAllCaps="true" 
      android:textColor="#ffffff" 
      android:layout_marginTop="20px" 
      android:textSize="10dp"/> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/ly1" 
     android:paddingLeft="5px" 
     android:paddingRight="5px" 
     android:id="@+id/ly2" 
     android:orientation="horizontal"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Exercise Name:" 
      android:textColor="#ffffff" 
      android:layout_marginTop="20px" 
      android:layout_weight="1"/> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/en1" 
      android:textColor="#ffffff" 
      android:layout_marginTop="20px" 
      android:layout_weight="1"/> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/ly2" 
     android:id="@+id/ly3" 
     android:paddingLeft="5px" 
     android:paddingRight="5px" 
     android:orientation="horizontal"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Speed: " 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/es1" 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/ly3" 
     android:paddingLeft="5px" 
     android:paddingRight="5px" 
     android:orientation="horizontal" 
     android:id="@+id/ly4"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Repetition: " 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 

     <TextView 
      android:id="@+id/erep1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="10px" 
      android:layout_weight="1" 
      android:textColor="#ffffff" 
      android:textDirection="ltr" /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/erep2" 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:id="@+id/erep3" 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/ly4" 
     android:paddingLeft="5px" 
     android:paddingRight="5px" 
     android:orientation="horizontal" 
     android:id="@+id/ly5"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Weight: " 
      android:textColor="#ffffff" 
      android:layout_marginTop="10px" 
      android:layout_weight="1"/> 

     <TextView 
      android:id="@+id/ew1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginTop="10px" 
      android:layout_weight="1" 
      android:textColor="#ffffff" 
      android:textDirection="ltr" /> 

    </LinearLayout> 
</LinearLayout> 



</RelativeLayout> 
</android.support.constraint.ConstraintLayout>

來源

2017-08-14 08:54:59

爲什麼不使用drawable left？

在第一個文本視圖中使用drawable，並在drawable和text之間使用適當的填充，可以輕鬆實現您的打算。

 <?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="fill_parent" 
     android:layout_height="fill_parent" 
     tools:context="com.example.spand.krishnasoftwares.Main2Activity"> 

      <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Exercise 1" 
      android:textAlignment="center" 
      android:textAllCaps="true" 
      android:textColor="#ffffff" 
      android:drawableLeft="@drawable/" 
      android:layout_marginTop="20px" 
      android:textSize="10dp"/> 
     </android.support.constraint.ConstraintLayout>

好處：您可以保存多個視圖組的額外嵌套。在回收視圖或列表視圖的情況下，渲染時間較短。由Google開發者資源推薦。

來源

2017-08-14 09:04:44 DevKRos

我認爲，他需要多個textviews ... –

@AshishJohn即使在這種情況下，他可以使用多個文本視圖對齊約束佈局，並可以使用drawableLeft。 Imageview Text1 Text2 <<<<<這種需求可以很容易地完成，而且不需要嵌套。保存的框架就是速度傳遞。 – DevKRos

您的.xml更改爲

<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="fill_parent" 
    android:layout_height="fill_parent"> 
    <RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:orientation="vertical" 
     android:background="@color/colorBackground"> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:orientation="horizontal" 
      android:paddingTop="20px" 
      android:id="@+id/vly"> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/imageView" 
       android:src="@drawable/gym_logo1"/> 
      <LinearLayout 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:orientation="vertical" 
       android:id="@+id/ly1"> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Exercise 1" 
        android:textAlignment="center" 
        android:textAllCaps="true" 
        android:textColor="#ffffff" 
        android:layout_marginTop="20px" 
        android:textSize="10dp"/> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Exercise Name:" 
        android:textColor="#ffffff" 
        android:layout_marginTop="20px" 
        android:layout_weight="1"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:id="@+id/en1" 
        android:textColor="#ffffff" 
        android:layout_marginTop="20px" 
        android:layout_weight="1"/> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Speed: " 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:id="@+id/es1" 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 

       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Repetition: " 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 

       <TextView 
        android:id="@+id/erep1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:textColor="#ffffff" 
        android:textDirection="ltr" /> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:id="@+id/erep2" 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:id="@+id/erep3" 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 
       <TextView 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Weight: " 
        android:textColor="#ffffff" 
        android:layout_marginTop="10px" 
        android:layout_weight="1"/> 

       <TextView 
        android:id="@+id/ew1" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_marginTop="10px" 
        android:layout_weight="1" 
        android:textColor="#ffffff" 
        android:textDirection="ltr" /> 
      </LinearLayout> 
     </LinearLayout> 
    </RelativeLayout> 
</android.support.constraint.ConstraintLayout>

來源

2017-08-14 09:49:57

想要在Android中顯示圖像和文本並排在Android

回答

相關問題