2016-10-10 3 views
0

Ich möchte eine benutzerdefinierte Ansicht mit 2 TextViews erstellen, mit der Möglichkeit, Text und Text Aussehen von XML zu ändern. Diese Ansicht sollte zwei Zustände haben - normal und ausgewählt (TextViews-Stil sollte für jeden Status unterschiedlich sein).Benutzerdefinierte Ansicht mit zwei TextViews

Ich brauche ein Beispiel dafür.

+0

so brauchen Sie eine benutzerdefinierte 'ViewGroup' Klasse – pskink

Antwort

8

Benutzerdefinierte Ansichten sind ziemlich einfach und es gibt Beispiele überall im Internet. Für etwas Einfaches wie zwei Textansichten ist es normalerweise am einfachsten, LinearLayout zu erweitern.

Hier ist das LinearLayout mit zwei nebeneinander angeordneten Textansichten.

res/double_text.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:orientation="horizontal" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent"> 

    <TextView 
     android:id="@+id/left_text" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:maxLines="1"/> 
    <TextView 
     android:id="@+id/right_text" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:maxLines="1"/> 
</LinearLayout> 

Als nächstes definieren wir einen styleable Ressourcenblock so können wir benutzerdefinierte Attribute zu unserem benutzerdefinierten Layout hinzuzufügen.

res/Werte/attrs.xml

<resources> 
    <declare-styleable name="DoubleText"> 
     <attr name="leftText" format="string" /> 
     <attr name="rightText" format="string" /> 
     <attr name="android:ems" /> 

    </declare-styleable> 
</resources> 

Als nächstes wird die Klassendatei für DoubleText benutzerdefinierte Ansicht. Hier ziehen wir die benutzerdefinierten Attribute heraus und setzen die einzelnen TextViews.

DoubleTextView.java

public class DoubleTextView extends LinearLayout { 
    LinearLayout layout = null; 
    TextView leftTextView = null; 
    TextView rightTextView = null; 
    Context mContext = null; 

    public DoubleTextView(Context context) { 

     super(context); 
     mContext = context; 
    } 

    public DoubleTextView(Context context, AttributeSet attrs) { 
     super(context, attrs); 

     mContext = context; 

     TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.DoubleText); 

     String leftText = a.getString(R.styleable.DoubleText_leftText); 
     String rightText = a.getString(R.styleable.DoubleText_rightText); 

     leftText = leftText == null ? "" : leftText; 
     rightText = rightText == null ? "" : rightText; 

     String service = Context.LAYOUT_INFLATER_SERVICE; 
     LayoutInflater li = (LayoutInflater) getContext().getSystemService(service); 

     layout = (LinearLayout) li.inflate(R.layout.double_text, this, true); 

     leftTextView = (TextView) layout.findViewById(R.id.left_text); 
     rightTextView = (TextView) layout.findViewById(R.id.right_text); 

     leftTextView.setText(leftText); 
     rightTextView.setText(rightText); 

     a.recycle(); 
    } 

    public DoubleTextView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
     mContext = context; 
    } 

    @SuppressWarnings("unused") 
    public void setLeftText(String text) { 
     leftTextView.setText(text); 
    } 

    @SuppressWarnings("unused") 
    public void setRightText(String text) { 
     rightTextView.setText(text); 
    } 

    @SuppressWarnings("unused") 
    public String getLeftText() { 
     return leftTextView.getText().toString(); 
    } 

    @SuppressWarnings("unused") 
    public String getRightText() { 
     return rightTextView.getText().toString(); 
    } 

} 

Schließlich ist die benutzerdefinierte Klasse verwenden wie einfach es in einer Layout-Datei erklärt.

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    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=".MainActivity"> 

    <TextView 
     android:id="@+id/main_text" 
     android:text="Hello World!" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textColor="@color/custom"/> 

    <example.com.test.DoubleTextView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:leftText="Text Left" 
     app:rightText="Text Right" 
     android:layout_below="@+id/main_text"/> 
</RelativeLayout> 

Einfach peasy.

+0

Ein kleiner Kommentar dort: Die Antwort ist großartig, aber es fehlt eine kleine Änderung in der benutzerdefinierten Ansicht xml: beide' TextView' brauchen 'android: layout_weight =" 1 " ' . Wenn nicht, erscheint nur der erste TextView auf dem Bildschirm. –

Verwandte Themen