web-dev-qa-db-ja.com

画像にテキストを描画する方法は?

画像にテキストを描画したい(その画像をテキストで保存するため)。画像ビューを使用して、ビットマップをその画像に設定します。画像にテキストを描画します(ユーザーが入力したテキスト)。保存する前にこれを試しました.....

void saveImage() {
    File myDir=new File("/sdcard/saved_images");
    myDir.mkdirs();
    Random generator = new Random();
    int n = 10000;
    n = generator.nextInt(n);
    String fname = "Image-"+ n +".jpg";
    File file = new File (myDir, fname);
    if (file.exists ()) file.delete (); 
    try {
           FileOutputStream out = new FileOutputStream(file);
           originalBitmap.compress(Bitmap.CompressFormat.JPEG, 90, out);
           out.flush();
           out.close();

    } catch (Exception e) {
           e.printStackTrace();
    }
}

XMLコードは..

<FrameLayout 
     Android:id="@+id/framelayout"
     Android:layout_marginTop="30dip"
     Android:layout_height="fill_parent" 
     Android:layout_width="fill_parent">

     <ImageView 
          Android:id="@+id/ImageView01"
          Android:layout_alignParentTop="true"
          Android:layout_height="wrap_content" 
          Android:layout_width="wrap_content"/>

     <TextView Android:id="@+id/text_view2"
          Android:layout_marginTop="20dip"
          Android:layout_width="wrap_content" 
          Android:text="SampleText"
          Android:textSize="12pt"
          Android:layout_alignTop="@+id/ImageView01" 
          Android:layout_height="wrap_content"/>  

</FrameLayout>
24

テキスト描画をサポートするためにSaveImage()メソッドを更新しました。

void saveImage() {
    File myDir=new File("/sdcard/saved_images");
    myDir.mkdirs();
    Random generator = new Random();
    int n = 10000;
    n = generator.nextInt(n);
    String fname = "Image-"+ n +".jpg";
    File file = new File (myDir, fname);
    if (file.exists ()) file.delete (); 
    try {
        FileOutputStream out = new FileOutputStream(file);

        // NEWLY ADDED CODE STARTS HERE [
            Canvas canvas = new Canvas(originalBitmap);

            Paint paint = new Paint();
            Paint.setColor(Color.WHITE); // Text Color
            Paint.setTextSize(12); // Text Size
            Paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER)); // Text Overlapping Pattern
            // some more settings...

            canvas.drawBitmap(originalBitmap, 0, 0, Paint);
            canvas.drawText("Testing...", 10, 10, Paint);
        // NEWLY ADDED CODE ENDS HERE ]

        originalBitmap.compress(Bitmap.CompressFormat.JPEG, 90, out);
        out.flush();
        out.close();
    } catch (Exception e) {
       e.printStackTrace();
    }
}

これがうまくいくかどうかを教えてください。

シャッシュ

25
Shash316

Vladislav Skoumalが推奨 のように、この方法を試してください:

public Bitmap drawTextToBitmap(Context mContext,  int resourceId,  String mText) {
    try {
         Resources resources = mContext.getResources();
         float scale = resources.getDisplayMetrics().density;
         Bitmap bitmap = BitmapFactory.decodeResource(resources, resourceId);
         Android.graphics.Bitmap.Config bitmapConfig =   bitmap.getConfig();
         // set default bitmap config if none
         if(bitmapConfig == null) {
           bitmapConfig = Android.graphics.Bitmap.Config.ARGB_8888;
         }
         // resource bitmaps are imutable,
         // so we need to convert it to mutable one
         bitmap = bitmap.copy(bitmapConfig, true);

         Canvas canvas = new Canvas(bitmap);
         // new antialised Paint
         Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
         // text color - #3D3D3D
         Paint.setColor(Color.rgb(110,110, 110));
         // text size in pixels
         Paint.setTextSize((int) (12 * scale));
         // text shadow
         Paint.setShadowLayer(1f, 0f, 1f, Color.DKGRAY);

         // draw text to the Canvas center
         Rect bounds = new Rect();
         Paint.getTextBounds(mText, 0, mText.length(), bounds);
         int x = (bitmap.getWidth() - bounds.width())/6;
         int y = (bitmap.getHeight() + bounds.height())/5;

         canvas.drawText(mText, x * scale, y * scale, Paint);

         return bitmap;
    } catch (Exception e) {
        // TODO: handle exception

        return null;
    }

}

このメソッドを呼び出す

Bitmap bmp =drawTextToBitmap(this,R.drawable.aa,"Hello Android");
img.setImageBitmap(bmp);

出力

enter image description here

50
Dwivedi Ji

ビューを拡張して、カスタムビューを作成できます。何かのようなもの

public class PieView extends View { 
    public PieView(Context context) {
        super(context);
        overlayBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.piechart_shade, 
        null);
        overlayWidth  = overlayBitmap.getWidth();
        setLayoutParams(new LayoutParams(overlayWidth, overlayWidth));      
    }

    @Override     
    protected void onDraw(Canvas canvas) {      
        super.onDraw(canvas);
    }
}

Ondrawメソッドでは、canvas.drawBitmapとcanvas.drawTextを使用して、ビットマップとテキストを描画できます。

この方法では、すべてが単一のカスタムビューにあるため、フレームレイアウトを必要としません。

これをxmlファイルに次のように含めることができます

<com.raj.PieView Android:id="@+id/framelayout" Android:layout_marginTop="30dip"      
    Android:layout_height="fill_parent" Android:layout_width="fill_parent"/>
1
blessenm
  1. 空のビットマップを作成します
  2. 新しいCanvasオブジェクトを作成し、このビットマップをそれに渡します
  3. view.draw(Canvas)を呼び出して、作成したばかりのキャンバスオブジェクトを渡します。詳細については、メソッドのドキュメントを参照してください。
  4. Bitmap.compress()を使用して、ビットマップのコンテンツをOutputStreamに書き込みます。

擬似コード:

Bitmap  bitmap = Bitmap.createBitmap(200,200,Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
canvas.drawText();
//necessary arguments and draw whatever you want. thes all are drawn on the bitmap.finally save this bitmap
bitmap.compress(Bitmap.CompressFormat.JPEG, 100, fos); 
1
Balaji.K

私はこの問題(不変ファイル)を解決しましたが、ファイルに書き込むものは何もありません...私のコードに従ってください:public static File writeOnImage(File file)throws IOException {

    Bitmap originalBitmap = BitmapFactory.decodeFile(file.getPath());
    originalBitmap = convertToMutable(originalBitmap);
    FileOutputStream out = new FileOutputStream(file);

    try {
        Canvas canvas = new Canvas(originalBitmap);

        Paint paint = new Paint();
        Paint.setColor(Color.BLACK);
        Paint.setStrokeWidth(12);
        Paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER));
        canvas.drawBitmap(originalBitmap, 0, 0, Paint);
        canvas.drawText("Testing...", 10, 10, Paint);

        originalBitmap.compress(Bitmap.CompressFormat.JPEG, 90, out);
        out.flush();
        out.close();

    } catch (Exception e) {
        e.printStackTrace();
    }

    return file;
}
0
LeandroPortnoy

画像上にテキストビューを展開します。基本的な例については、 http://www.Android10.org/index.php/forums/43-view-layout-a-resource/715-tutorial-Android-xml-view-inflation を参照してください。これが最も簡単な方法です。

LinearLayout lLayout;

lLayout = (LinearLayout)findViewById(R.id.layout1);

layout1 is the main layout.

final LayoutInflater  inflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);

TextView tv = (TextView)inflater.inflate(R.layout.text, null);

lLayout.addView(tv);
0