Wie erstellt man ein Layout wie dieses auf Android?

Question

ich würde gerne wissen, wie ich ein Layout wie dieses auf Android machen kann. Ich könnte ein LinearLayout mit einer horizontalen Ausrichtung verwenden und 2 lineare Layouts, das erste (das rote) mit 1 Gewicht und das andere (das weiße), mit 2 Gewicht und in ihnen würde ich einige Textansichten und so setzen on, aber meine Hauptfrage ist: Wie kann ich in die XML einen Code einfügen, um dieses kleine rote Dreieck erscheinen zu lassen, das ist meine Frage, denn ohne es ist es einfach, dieses Layout zu machen, aber ich weiß nicht, wie setze eine geometrische Form wie diese in ein Layout. Kannst du mir ein paar Vorschläge geben? Sie müssen nicht Code eingeben, wenn Sie nicht wollen, Ideen sind genug :) Vielen Dank im Voraus.

Answer 1

würde ich ConstraintLayout verwenden. Im Allgemeinen ist es die beste Wahl für komplexe Layouts wie diese. Unten ist mein Versuch, dieses Layout zu reproduzieren; Ich habe mich nicht mit perfekten Farben oder Schriften beschäftigt, aber die allgemeine Struktur ist da.

Layout-XML

<FrameLayout 
    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="150dp" 
    android:layout_margin="12dp" 
    android:padding="1dp" 
    android:background="#f00"> 

    <android.support.constraint.ConstraintLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="#fff"> 

     <FrameLayout 
      android:id="@+id/redBg" 
      android:layout_width="120dp" 
      android:layout_height="0dp" 
      android:background="#f00" 
      app:layout_constraintTop_toTopOf="parent" 
      app:layout_constraintLeft_toLeftOf="parent" 
      app:layout_constraintBottom_toBottomOf="parent"/> 

     <FrameLayout 
      android:id="@+id/caret" 
      android:layout_width="12dp" 
      android:layout_height="40dp" 
      android:background="@drawable/caret" 
      app:layout_constraintTop_toTopOf="parent" 
      app:layout_constraintLeft_toRightOf="@+id/redBg" 
      app:layout_constraintBottom_toBottomOf="parent"/> 

     <android.support.constraint.Guideline 
      android:id="@+id/guideline" 
      android:layout_width="0dp" 
      android:layout_height="0dp" 
      android:orientation="horizontal" 
      app:layout_constraintGuide_percent="0.5"/> 

     <TextView 
      android:id="@+id/subtitle" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textColor="#fff" 
      android:textSize="12sp" 
      app:layout_constraintLeft_toLeftOf="@+id/redBg" 
      app:layout_constraintRight_toRightOf="@+id/redBg" 
      app:layout_constraintBottom_toTopOf="@+id/guideline" 
      tools:text="26/04/2017"/> 

     <TextView 
      android:id="@+id/title" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textColor="#fff" 
      android:textSize="16sp" 
      app:layout_constraintLeft_toLeftOf="@+id/redBg" 
      app:layout_constraintRight_toRightOf="@+id/redBg" 
      app:layout_constraintBottom_toTopOf="@+id/subtitle" 
      tools:text="Amanha"/> 

     <TextView 
      android:id="@+id/description" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="12dp" 
      android:layout_marginStart="12dp" 
      android:textColor="#f00" 
      android:textSize="12sp" 
      app:layout_constraintLeft_toRightOf="@+id/caret" 
      app:layout_constraintBottom_toTopOf="@+id/guideline" 
      tools:text="1 Mililitro"/> 

     <TextView 
      android:id="@+id/name" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="12dp" 
      android:layout_marginStart="12dp" 
      android:textColor="#f00" 
      android:textSize="16sp" 
      app:layout_constraintLeft_toRightOf="@+id/caret" 
      app:layout_constraintBottom_toTopOf="@+id/description" 
      tools:text="Amoxilina"/> 

     <ImageView 
      android:layout_width="24dp" 
      android:layout_height="24dp" 
      android:layout_marginRight="16dp" 
      android:src="@drawable/oval" 
      app:layout_constraintBottom_toTopOf="@+id/guideline" 
      app:layout_constraintRight_toRightOf="parent"/> 

     <TextView 
      android:id="@+id/time" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginBottom="4dp" 
      android:textColor="#f00" 
      android:textSize="16sp" 
      app:layout_constraintLeft_toRightOf="@+id/caret" 
      app:layout_constraintBottom_toBottomOf="parent" 
      tools:text="08:00"/> 

     <TextView 
      android:id="@+id/details" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginRight="8dp" 
      android:layout_marginBottom="4dp" 
      android:textColor="#f00" 
      android:textSize="16sp" 
      app:layout_constraintRight_toRightOf="parent" 
      app:layout_constraintBottom_toBottomOf="parent" 
      tools:text="+detalhes"/> 

    </android.support.constraint.ConstraintLayout> 

</FrameLayout> 

Caret Vektor

<vector 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:width="24dp" 
    android:height="24dp" 
    android:viewportWidth="24.0" 
    android:viewportHeight="24.0"> 
    <path 
     android:fillColor="#FFff0000" 
     android:pathData="M0 0L24 12L0 24z"/> 
</vector> 

Screenshot