想要在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

回答

相关问题