사용자 정의 view 그림 둘러싸 기 효과 구현

워드 에 있 는 그림 과 글 이 둘러싸 인 효 과 를 실현 하기 위해 네트워크 의 많은 방법 을 참고 하여 사용자 정의 view 방법 을 선택 하 였 습 니 다.본인 이 웹 뷰 사용 을 잘 못 해서 요.
       글 참고:http://mobile.51cto.com/abased-375949.htm
            나중에 알 고 보 니 이것 은 이미 봉 인 된 방법 이 었 다.우리 가 알고리즘 을 생각 할 필요 도 없어.나 는 진심으로 그것 의 원시 작가 에 게 감사 한다.이후 인용 과 자기 공 고 를 위해 쓰기 로 했다.
       우선, 사용자 정의 view 는 이미 완제품 입 니 다.나 는 짐꾼 이 되 었 다.
FloatImageText.java
package com.esri.arcgis.android.samples.helloworld;

import java.util.ArrayList;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.Paint.FontMetrics;
import android.util.AttributeSet;
import android.util.DisplayMetrics;
import android.view.View;

/**
 *   CSS  float    
 */
public class FloatImageText extends View {
	private Bitmap mBitmap;
	private final Rect bitmapFrame = new Rect();
	private final Rect tmp = new Rect();
	private int mTargetDentity = DisplayMetrics.DENSITY_DEFAULT;

	private final Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
	private String mText;
	private ArrayList<TextLine> mTextLines;
	private final int[] textSize = new int[2];

	public FloatImageText(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		init();
	}

	public FloatImageText(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}

	public FloatImageText(Context context) {
		super(context);
		init();
	}

	private void init() {
		mTargetDentity = getResources().getDisplayMetrics().densityDpi;
		mTextLines = new ArrayList<TextLine>();

		mPaint.setTextSize(14);
		mPaint.setColor(Color.BLACK);

	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		int w = 0, h = 0;
		//     
		w += bitmapFrame.width();
		h += bitmapFrame.height();

		//     
		if (null != mText && mText.length() > 0) {
			mTextLines.clear();
			int size = resolveSize(Integer.MAX_VALUE, widthMeasureSpec);
			measureAndSplitText(mPaint, mText, size);
			final int textWidth = textSize[0], textHeight = textSize[1];
			w += textWidth; //     
			if (h < textHeight) { //     
				h = (int) textHeight;
			}
		}

		w = Math.max(w, getSuggestedMinimumWidth());
		h = Math.max(h, getSuggestedMinimumHeight());

		setMeasuredDimension(resolveSize(w, widthMeasureSpec),
				resolveSize(h, heightMeasureSpec));
	}

	@Override
	protected void onDraw(Canvas canvas) {
		//     
		if (null != mBitmap) {
			canvas.drawBitmap(mBitmap, null, bitmapFrame, null);
		}

		//     
		TextLine line;
		final int size = mTextLines.size();
		for (int i = 0; i < size; i++) {
			line = mTextLines.get(i);
			canvas.drawText(line.text, line.x, line.y, mPaint);
		}
		System.out.println(mTextLines);
	}

	public void setImageBitmap(Bitmap bm) {
		setImageBitmap(bm, null);
	}

	public void setImageBitmap(Bitmap bm, int left, int top) {
		setImageBitmap(bm, new Rect(left, top, 0, 0));
	}

	public void setImageBitmap(Bitmap bm, Rect bitmapFrame) {
		mBitmap = bm;
		computeBitmapSize(bitmapFrame);
		requestLayout();
		invalidate();
	}

	public void setText(String text) {
		mText = text;
		requestLayout();
		invalidate();
	}

	private void computeBitmapSize(Rect rect) {
		if (null != rect) {
			bitmapFrame.set(rect);
		}
		if (null != mBitmap) {
			if (rect.right == 0 && rect.bottom == 0) {
				final Rect r = bitmapFrame;
				r.set(r.left, r.top,
						r.left + mBitmap.getScaledHeight(mTargetDentity), r.top
								+ mBitmap.getScaledHeight(mTargetDentity));
			}
		} else {
			bitmapFrame.setEmpty();
		}
	}

	private void measureAndSplitText(Paint p, String content, int maxWidth) {
		FontMetrics fm = mPaint.getFontMetrics();
		final int lineHeight = (int) (fm.bottom - fm.top);

		final Rect r = new Rect(bitmapFrame);
		// r.inset(-5, -5);

		final int length = content.length();
		int start = 0, end = 0, offsetX = 0, offsetY = 0;
		int availWidth = maxWidth;
		TextLine line;
		boolean onFirst = true;
		boolean newLine = true;
		while (start < length) {
			end++;
			if (end == length) { //           
				if (start <= length - 1) {
					if (newLine)
						offsetY += lineHeight;
					line = new TextLine();
					line.text = content.substring(start, end - 1);
					line.x = offsetX;
					line.y = offsetY;
					mTextLines.add(line);
				}
				break;
			}
			p.getTextBounds(content, start, end, tmp);
			if (onFirst) { //           
				onFirst = false;
				final int height = lineHeight + offsetY;
				if (r.top >= height) { //           
					offsetX = 0;
					availWidth = maxWidth;
					newLine = true;
				} else if (newLine
						&& (r.bottom >= height && r.left >= tmp.width())) { //          
					offsetX = 0;
					availWidth = r.left;
					newLine = false;
				} else if (r.bottom >= height
						&& maxWidth - r.right >= tmp.width()) { //     
					offsetX = r.right;
					availWidth = maxWidth - r.right;
					newLine = true;
				} else { //   
					offsetX = 0;
					availWidth = maxWidth;
					if (offsetY < r.bottom)
						offsetY = r.bottom;
					newLine = true;
				}
			}

			if (tmp.width() > availWidth) { //              
				onFirst = true;
				line = new TextLine();
				line.text = content.substring(start, end - 1);
				line.x = offsetX;
				mTextLines.add(line);
				if (newLine) {
					offsetY += lineHeight;
					line.y = offsetY;
				} else {
					line.y = offsetY + lineHeight;
				}

				start = end - 1;
			}
		}
		textSize[1] = offsetY;
	}

	class TextLine {
		String text;
		int x;
		int y;

		@Override
		public String toString() {
			return "TextLine [text=" + text + ", x=" + x + ", y=" + y + "]";
		}
	}
}

다음은 이 view 를 어떻게 사용 하 는 지 입 니 다.호출 이 필요 한 곳 에 text 내용 과 그림 내용 을 추가 하고 그림 이 표시 되 는 위 치 를 설정 하면 됩 니 다.콜 아웃 에 표 시 됩 니 다.
여 기 는 내 callout 의 내부 레이아웃 파일 설정 입 니 다.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/callouttile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textColor="#000000" />

        <ImageButton
            android:id="@+id/exitcallout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:background="@drawable/exit" />
    </LinearLayout>

    <cn.com.esrichina.imagetext.FloatImageText
        android:id="@+id/view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    

</LinearLayout>

다음은 제 콜 아웃 이 표 시 될 때 사용자 정의 view 를 초기 화하 고 호출 합 니 다.
private void DisplayCallout(Point point) {
		LayoutInflater inflater = LayoutInflater.from(GoogleMapActivity.this);
		View view = inflater.inflate(R.layout.callout, null);
		calloutTile = (TextView) view.findViewById(R.id.callouttile);
		FloatImageText imageText;
		imgTxtView = (FloatImageText) view.findViewById(R.id.view);
		imgTxtView.setMinimumWidth(300);
		imgTxtView.setMinimumHeight(100);
		callout = mapView.getCallout();
		SetCalloutContent(checkGraphic);
		
		callout.setStyle(R.xml.calloutstyle);
		callout.setMaxWidth(400);
		callout.setMaxHeight(400);
		callout.refresh();
		callout.show(point, view);
	}
private void SetCalloutContent(int i) {
		
		int a, b;
		a = 2;
		b = 6;
		// callout      
		if (isRelease.get(i) == 1) {
			calloutTile.getPaint().setFakeBoldText(true);//     
			calloutTile.setText(stnm.get(i) + "(   )");
			if (lev.get(i) == 1) {
				Bitmap bm = BitmapFactory.decodeResource(getResources(),
						R.drawable.icon_blue);
				imgTxtView.setImageBitmap(bm, a, b);//          。
			} else {
				Bitmap bm = BitmapFactory.decodeResource(getResources(),
						R.drawable.icon_yellow);
				imgTxtView.setImageBitmap(bm, a, b);
			}
		} else {
			calloutTile.getPaint().setFakeBoldText(true);//     
			calloutTile.setText(stnm.get(i));
			if (lev.get(i) == 1) {
				Bitmap bm = BitmapFactory.decodeResource(getResources(),
						R.drawable.icon_blue);
				imgTxtView.setImageBitmap(bm, a, b);
				} else {
				Bitmap bm = BitmapFactory.decodeResource(getResources(),
						R.drawable.icon_yellow);
				imgTxtView.setImageBitmap(bm, a, b);
				}
		}
		imgTxtView.setText(content.get(i));// end callout config

	}

이렇게 해서 이미 호출 이 실현 되 었 다.효과 도 한 장 더 주세요.
마지막 으로 인터넷 에서 찾 은 웹 뷰 를 이용 한 기술 스티커 주소:http://www.easymorse.com/index.php/archives/1464

좋은 웹페이지 즐겨찾기