เค้าโครงของ Android: แท็กนี้และลูก ๆ ของแท็กนี้สามารถแทนที่ได้ด้วย <TextView /> หนึ่งแท็กและวาดประกอบได้


116

เมื่อฉันเรียกใช้เลย์เอาต์บนไฟล์ XML เฉพาะฉันจะได้รับสิ่งนี้:

 This tag and its children can be replaced by one <TextView/> 
and a compound drawable

ควรทำการเปลี่ยนแปลงอะไรสำหรับโค้ด xml ต่อไปนี้:

<LinearLayout android:id="@+id/name_layout"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:background="@drawable/grouplist_single_left_grey_area" >
                <ImageView android:id="@+id/photo_image"
                    android:layout_width="@dimen/thumbnail_width"
                    android:layout_height="@dimen/thumbnail_height"
                    android:paddingBottom="5dip"
                    android:paddingTop="5dip"
                    android:paddingRight="5dip"
                    android:paddingLeft="5dip"
                    android:layout_marginRight="5dip"
                    android:clickable="true"
                    android:focusable="true"
                    android:scaleType="fitCenter"
                    android:src="@*android:drawable/nopicture_thumbnail"
                    android:background="@drawable/photo_highlight" />
                <TextView android:id="@+id/name"
                    android:paddingLeft="5dip"
                    android:layout_weight="1"
                    android:layout_width="0dip"
                    android:layout_height="wrap_content"
                    android:gravity="center_vertical"
                    android:textAppearance="?android:attr/textAppearanceLarge" />
            </LinearLayout>

นี่คือลักษณะที่ปรากฏบนหน้าจอ:

ใส่คำอธิบายภาพที่นี่

ไอคอนกล้องเป็นค่าเริ่มต้น การคลิกที่จะทำให้ผู้ใช้มีตัวเลือกในการเลือกภาพอื่น


3
+1 เนื่องจากสถานการณ์นี้ดูซับซ้อนเกินกว่าที่จะจัดการได้โดยใช้สารประกอบที่วาดได้ หากคุณไม่ยอมรับคำตอบของ Romain คุณอาจได้รับคำตอบในเชิงลึกมากขึ้น
AlbeyAmakiir

คำตอบ:


153

หากต้องการขยายคำตอบของ Romain Guy นี่คือตัวอย่าง

ก่อน:

<LinearLayout 
android:layout_width="fill_parent"
android:layout_height="wrap_content" 
android:layout_marginTop="10dp"  
android:padding="5dp" >

<TextView 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:text="My Compound Button" />

<ImageView 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/my_drawable" />
</LinearLayout>

หลังจาก:

<TextView  
    android:layout_marginTop="10dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:text="My Compound Button" 
    android:drawableRight="@drawable/my_drawable" android:padding="5dp" />

45
ดี แต่ถ้าฉันต้องการตั้งค่าคุณสมบัติบน drawable เช่นกำหนดเป็น 60dip x 60dip?
Kyle Clegg

4
ดูสิสิ่งที่ฉันต้องทำคือค้นหา stackoverflow.com/a/6671544/1224741
QED

@KyleClegg เป็นไปได้ด้วยไลบรารีที่กำหนดเอง ดูคำตอบของฉัน - stackoverflow.com/a/41347470/2308720
Oleksandr

102

ผสานTextViewและImageViewเป็นหนึ่งโดยใช้ TextView ของวิธีการหรือการใช้setCompoundDrawable*()android:drawableLeft


30
คุณช่วยชี้ให้ฉันดูตัวอย่างที่แสดงให้เห็นว่าสามารถทำได้อย่างไร ฉันไม่แน่ใจว่าแอตทริบิวต์ทั้งหมดใน ImageView สามารถรองรับใน android: drawableLeft ได้อย่างไร ขอบคุณ
pdilip

1
คุณลักษณะของ ImageViews เช่น scaleType ล่ะ
neteinstein

2
ฉันจะเพิ่มช่องว่างระหว่างรูปภาพและข้อความได้อย่างไร
TharakaNirmana

2
setCompoundDrawable * () ไม่ทำงานให้ใช้ setCompoundDrawablesWithIntrinsicBounds () แทน
Kimo_do

1
@Kimo_do setCompoundDrawable()จะไม่ดูแลการเบิกจ่ายของคุณอย่างที่เป็นอยู่คุณต้องเรียกsetBoundsมัน (ดูAPI ) สำหรับการตั้งค่านั้นคุณจะได้รับขอบเขตที่ผ่านมาโดยใช้TextView.getCompoundDrawables()การเข้าถึงดัชนี drawable getBounds()ที่ถูกต้องและในที่สุดก็เรียก
Avinash R

19

คิดว่าฉันจะพยายามหา puntos พิเศษสำหรับสิ่งนี้เช่นกัน: คุณสามารถเพิ่มช่องว่างระหว่างรูปภาพและข้อความโดยใช้android:drawablePadding. https://stackoverflow.com/a/6671544/1224741


3

บางครั้งอาจเป็นไปได้ที่จะแทนที่ImageView(หรือหลายตัว) และTextViewด้วยหนึ่งที่TextViewมีสารประกอบที่วาดได้ ไม่มีปัจจัยหลายประการที่สามารถนำไปใช้กับ drawable สารประกอบใช้ API พื้นเมืองและห้องสมุด TextViewRichDrawableแต่ถ้าคุณสามารถจัดการหนึ่ง TextView แทนการใช้ LinearLayout คุณแน่นอนควรจะใช้มัน

รายการแอตทริบิวต์และพารามิเตอร์ที่สามารถนำไปใช้กับ drawables แบบผสม:

ขนาด: ( ใช่จริงๆ ):

<com.tolstykh.textviewrichdrawable.TextViewRichDrawable
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Some text"
    app:compoundDrawableHeight="24dp"
    app:compoundDrawableWidth="24dp"/>

แม้ทรัพยากรเวกเตอร์ชุดเป็น drawable:

<com.tolstykh.textviewrichdrawable.TextViewRichDrawable
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Some text"
    app:drawableTopVector="@drawable/some_vector_drawble"
    app:drawableEndVector="@drawable/another_vector_drawable" />

Padding ของ Drawable โดยใช้เนทีฟ API android:drawablePadding-> ลิงค์

นี่คือตัวอย่าง:

textView ที่วาดได้ที่หลากหลาย


2

LinearLayoutซึ่งมีImageViewและTextViewสามารถจัดการได้อย่างมีประสิทธิภาพมากขึ้นเป็น drawable Punch (เดียว TextViewโดยใช้drawableTop, drawableLeft, drawableRight และ / หรือdrawableBottomแอตทริบิวต์การวาดหนึ่งหรือมากกว่าภาพที่อยู่ติดกับข้อความ)

หากทั้งสองวิดเจ็ตถูกหักล้างกันด้วยระยะขอบสามารถแทนที่ด้วยdrawablePaddingแอตทริบิวต์

มีการแก้ไขผ้าสำลีเพื่อทำการแปลงนี้ในปลั๊กอิน Eclipse

จาก: Android Official API docs!



1

เมื่อฉันทำตามโค้ดด้านบนข้อความภายใน TextView ตั้งค่าไม่ถูกต้อง คุณต้องตั้งค่าแรงโน้มถ่วงให้เป็นศูนย์กลาง | เริ่มต้นเพื่อบรรลุสิ่งที่แสดงในคำถามที่ถาม

textview มีลักษณะดังนี้:

   <TextView
        android:id="@+id/export_text"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:drawableLeft="@drawable/up_arrow"
        android:drawableStart="@drawable/up_arrow"
        android:gravity="center|start"
        android:text="....."
        android:textSize="@dimen/font_size15" >
    </TextView>

0

หากคุณไม่ต้องการเปลี่ยน ImageView และ TextView คุณสามารถเปลี่ยนเวอร์ชันใน AndroidManifest.xml ได้ดังนี้

    <uses-sdk`
    android:minSdkVersion="8"
    android:targetSdkVersion="18" 
    />

หากเวอร์ชันของคุณคือ android: targetSdkVersion = "17" ให้เปลี่ยนเป็น "18"

หวังว่านี่จะแก้ไขได้ ฉันทำมันและทำให้ถูกต้อง


-2

อีกวิธีหนึ่งคือการฝัง ViewImage ลงใน LinearLayout อื่น (อนุญาตให้จัดการด้วย id คนเดียว):

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <LinearLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >    
        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/blue_3"
            android:layout_gravity="center_horizontal"
            android:paddingTop="16dp" />
    </LinearLayout>
    <TextView 
        android:id="@+id/tvPrompt"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:paddingTop="16dp"
        android:text="@string/xy" />


ตอนนี้ข้อดีของสิ่งนี้คืออะไร? แล้วทำไมตั้งเนมสเปซสองครั้ง
ygesher

-5
    This tag and its children can be replaced by one <TextView/> and a compound drawable



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

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:focusable="false"
        android:contentDescription="."
        android:padding="3dp" 
        android:src="@drawable/tab_home_btn">
    </ImageView>

    <TextView
        android:id="@+id/textview"       
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:text="首页"
        android:textSize="10sp"
        android:textColor="#ffffff">
    </TextView>

</LinearLayout>
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.