Văn bản Android trên hình ảnh


95

Tôi có một imageView với một hình ảnh, trên hình ảnh đó, tôi muốn đặt một văn bản. Làm thế nào tôi có thể đạt được điều đó?


1
Cách đơn giản là lấy một textView và đặt nó làm nền như bạn làm trong ImageView. nó sẽ làm công việc của bạn dễ dàng ..
AndroidGeek

chỉ cần nhìn vào liên kết dưới đây. Tôi hy vọng nó sẽ giúp u ... stackoverflow.com/questions/11100428/...
Ganesh Katikar

Câu trả lời:


162

Đó là cách tôi đã làm và nó hoạt động chính xác như bạn đã yêu cầu bên trong RelativeLayout:

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/relativelayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ImageView
        android:id="@+id/myImageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/myImageSouce" />

    <TextView
        android:id="@+id/myImageViewText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/myImageView"
        android:layout_alignTop="@id/myImageView"
        android:layout_alignRight="@id/myImageView"
        android:layout_alignBottom="@id/myImageView"
        android:layout_margin="1dp"
        android:gravity="center"
        android:text="Hello"
        android:textColor="#000000" />

</RelativeLayout>

Cảm ơn rất nhiều cho ví dụ này. Tôi đã cố gắng sử dụng chế độ xem văn bản có thể vẽ được phức tạp nhưng ở đó tôi không thể đặt url hình ảnh. Nhưng điều quan trọng là sử dụng cách giải quyết này trong một bố cục tương đối để cài đặt layout_align được công nhận.
AntonSack

đặt id của kiểm soát để sự liên kết đã giải quyết rất nhiều, nhờ
kal kokah

16

Bạn có thể muốn thực hiện nếu từ một khía cạnh khác: Có vẻ như dễ dàng hơn để có một TextView với một tệp có thể vẽ trên nền:

 <TextView
            android:id="@+id/text"
            android:background="@drawable/rounded_rectangle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
        </TextView>

10
vấn đề với câu trả lời này là bạn không thể kiểm soát các thuộc tính nền như imageView. quy mô chẳng hạn.
Jesus Dimrix

6

Bạn có thể

  • tạo một lớp mới kế thừa từ Class ImageView và
  • ghi đè Phương thức onDraw. Gọi super.onDraw()trong phương thức đó trước và
  • sau đó vẽ một số Văn bản bạn muốn hiển thị.

nếu bạn làm theo cách đó, bạn có thể sử dụng điều này như một Thành phần bố cục duy nhất giúp bố trí cùng với các thành phần khác dễ dàng hơn.



5

Có rất nhiều cách. Bạn sử dụng RelativeLayout hoặc AbsoluteLayout.

Với tương đối, bạn có thể căn chỉnh hình ảnh với cha mẹ ở phía bên trái và cũng có thể căn chỉnh văn bản với cha mẹ bên trái ... sau đó bạn có thể sử dụng lề và đệm và trọng lực trên chế độ xem văn bản để nó được xếp ở vị trí của bạn. muốn qua hình ảnh.


1
Tôi đến với phương pháp này một cách tình cờ. Nhưng nó rất tiện dụng khi bạn muốn đặt một số văn bản trên nút hình ảnh hoặc chế độ xem hình ảnh. Ví dụ - đặt nhiệt độ hiện tại lên hình ảnh của các điều kiện hiện tại.
Phobos

2

Bạn có thể sử dụng TextView và thay đổi nền của nó thành hình ảnh bạn muốn sử dụng


vấn đề với câu trả lời này là bạn không thể kiểm soát các thuộc tính nền như imageView. quy mô chẳng hạn.
Jesus Dimrix

2

Đối với điều này, bạn chỉ có thể sử dụng một TextView với android:drawableLeft/Right/Top/Bottomđể định vị một Hình ảnh vào TextView. Hơn nữa, bạn có thể sử dụng một số phần đệm giữa TextView và có thể vẽ vớiandroid:drawablePadding=""

Sử dụng nó như thế này:

<TextView
    android:id="@+id/textAndImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    android:drawableBottom="@drawable/yourDrawable"
    android:drawablePadding="10dp" 
    android:text="Look at the drawable below"/>

Với điều này, bạn không cần thêm ImageView. Cũng có thể sử dụng hai bảng có thể kéo trên nhiều mặt của TextView.

Vấn đề duy nhất bạn sẽ phải đối mặt khi sử dụng điều này, là bản vẽ không thể được thu nhỏ theo cách của ImageView.


2

Hãy thử mã dưới đây, điều này sẽ giúp bạn

  <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="150dp">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/gallery1"/>


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="#7ad7d7d7"
        android:gravity="center"
        android:text="Juneja Art Gallery"
        android:textColor="#000000"
        android:textSize="15sp"/>
</RelativeLayout>

0

Đoạn mã dưới đây sẽ giúp bạn

public class TextProperty {
    private int heigt;                              //读入文本的行数
    private String []context = new String[1024];    //存储读入的文本

    /*
     *@parameter wordNum
     *
     */
    public TextProperty(int wordNum ,InputStreamReader in) throws Exception {
        int i=0;
        BufferedReader br = new BufferedReader(in);
        String s;
        while((s=br.readLine())!=null){
            if(s.length()>wordNum){
                int k=0;
                while(k+wordNum<=s.length()){
                    context[i++] = s.substring(k, k+wordNum);
                    k=k+wordNum;
                }
                context[i++] = s.substring(k,s.length());
            }
            else{
                context[i++]=s;
            }
        }
        this.heigt = i;
        in.close();
        br.close();
    }


    public int getHeigt() {
        return heigt;
    }

    public String[] getContext() {

        return context;
    }
}
public class MainActivity extends AppCompatActivity {

    private Button btn;
    private ImageView iv;
    private final int WORDNUM = 35;  //转化成图片时  每行显示的字数
    private final int WIDTH = 450;   //设置图片的宽度

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        iv = (ImageView) findViewById(R.id.imageView);
        btn = (Button) findViewById(R.id.button);

        btn.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                int x=5,y=10;
                try {
                    TextProperty tp = new TextProperty(WORDNUM, new InputStreamReader(getResources().getAssets().open("1.txt")));
                    Bitmap bitmap = Bitmap.createBitmap(WIDTH, 20*tp.getHeigt(), Bitmap.Config.ARGB_8888);
                    Canvas canvas = new Canvas(bitmap);
                    Paint paint = new Paint();
                    paint.setColor(Color.WHITE);
                    paint.setTextAlign(Paint.Align.LEFT);
                    paint.setTextSize(20f);

                    String [] ss = tp.getContext();
                    for(int i=0;i<tp.getHeigt();i++){
                        canvas.drawText(ss[i], x, y, paint);
                        y=y+20;
                    }

                    canvas.save(Canvas.ALL_SAVE_FLAG);
                    canvas.restore();
                    String path = Environment.getExternalStorageDirectory() + "/image.png";
                    System.out.println(path);
                    FileOutputStream os = new FileOutputStream(new File(path));
                    bitmap.compress(Bitmap.CompressFormat.PNG, 100, os);
                    //Display the image on ImageView.
                    iv.setImageBitmap(bitmap);
                    iv.setBackgroundColor(Color.BLUE);
                    os.flush();
                    os.close();
                }
                catch (Exception e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }
            }
        });
    }
}```
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.