如何更改图像中特定区域的背景颜色,并在用户单击同一区域时更改颜色

时间:2016-12-21 10:26:16

标签: java android imagemap

我的问题是我正在尝试在我的应用中显示停车场预订系统。我想以绿色显示所有可用空间,当用户预订空间时,同一区域应变为红色。以下是图片:

enter image description here

我尝试了很多方法,但没有取得任何成功。以下是我的代码:

public class CarParkingActivity extends AppCompatActivity {

private ImageMap mImageMap;
private RelativeLayout stage;
private RelativeLayout.LayoutParams lparams;
private SparseArray<ImageMap.Bubble> spaces;
private String title;
Tracker mytracker;

private List<String> blocks; //list of 'occupied' spaces

@Override
protected void onCreate(Bundle savedInstanceCarParking) {
    super.onCreate(savedInstanceCarParking);
    setContentView(R.layout.activity_car_parking);

    blocks = new ArrayList<>();
    blocks.add("p1");
    blocks.add("p3");
    blocks.add("p6");
    blocks.add("p13");
    blocks.add("p9");
    blocks.add("p200");


    // find the image map in the view
    mImageMap = (ImageMap) findViewById(R.id.map);
    stage = (RelativeLayout) findViewById(R.id.stage);
    mImageMap.setImageResource(R.drawable.carpark2);

    title = getIntent().getStringExtra("option");
    getSupportActionBar().setTitle(title);
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    // add a click handler to react when areas are tapped
    mImageMap.addOnImageMapClickedHandler(new ImageMap.OnImageMapClickedHandler() {
        @Override
        public void onImageMapClicked(int id, ImageMap imageMap) {

            mImageMap.showBubble(id);

            if (blocks.contains(imageMap.getArea(id).getName())) {

                MySingleton.getInstance().showToast(getApplicationContext(), "Sorry, this car space is occupied");

                spaces = mImageMap.getParkings();
                drawParkSpace(spaces.get(id)._x, spaces.get(id)._y, false);



            } else {
                //open booking view
                Intent it = new Intent(getApplicationContext(), BookingCarParkingActivity.class);
                it.putExtra("parkId", imageMap.getArea(id).getName().toUpperCase());
                startActivity(it);
            }


        }

        @Override
        public void onBubbleClicked(int id) {
            Log.i("app", "onBubbleClicked: id: " + id);
        }
    });


}

/**
 * Draw red or green rect on the view.
 *
 * @param x
 * @param y
 * @param isOk: true equals green
 */
private void drawParkSpace(float x, float y, Boolean isOk) {
    Drawable imageView = null;
    imageView = ContextCompat.getDrawable(CarParkingActivity.this, isOk ? R.drawable.carok : R.drawable.carnook);

    lparams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    ImageView imageView1 = new ImageView(CarParkingActivity.this);
    imageView1.setImageDrawable(imageView);
    imageView1.setLayoutParams(lparams);
    imageView1.setX(x);
    imageView1.setY(y);
    stage.addView(imageView1);
}

@Override
protected void onResume() {
    super.onResume();
    mImageMap.loadMap("menu"); //load menu mapped image
    //List<ImageMap.PolyArea> list = mImageMap.getPolys();
    //ImageMap.PolyArea poly = list.get(0);

}


@Override
public boolean onOptionsItemSelected(MenuItem item) {

    switch (item.getItemId()) {

        case android.R.id.home:
            this.finish();
            return true;

    }


    return false;



    }
}

现在每辆车都是可点击的,但是我需要更改图像中显示的颜色,当用户预订空间时,同一区域应该变成红色。请帮我解决这个任务。我是android新手,但努力解决这个问题。如果我的问题不够强,请接受我的道歉。也提前多多感谢。这是我预订空间时的第二项活动

ImageMapClass

1 个答案:

答案 0 :(得分:1)

根据您的需要,您必须保留两个列表和两个绘画对象来跟踪预订空间和未预订空间。

- 可用空间列表。

- 预订空间列表。

- 预订空间油漆

- 预订空间油漆

 Paint bubblePaint;
 Paint bookedBubblePaint;

  //list of bubbles available
  SparseArray<Bubble> mBubbleMap = new SparseArray<Bubble>();

  //list of bubbles already booked
  SparseArray<Bubble> bookedBubble = new SparseArray<Bubble>();

protected void drawBubbles(Canvas canvas) {
        for (int i = 0; i < mBubbleMap.size(); i++) {
            int key = mBubbleMap.keyAt(i);
            Bubble b = mBubbleMap.get(key);
            if (b != null) {
                b.onDraw(canvas, false);//send info of booked status

            }
        }

        for (int i = 0; i < bookedBubble.size(); i++) {
            int key = bookedBubble.keyAt(i);
            Bubble b = bookedBubble.get(key);
            if (b != null) {
                b.onDraw(canvas, true);//send info of booked status

            }
        }
    }

然后在您的Bubble类onDraw方法中根据预订状态绘制绘画

 void onDraw(Canvas canvas, boolean isBooked) {
            if (_a != null) {
                // Draw a shadow of the bubble
                float l = _left + mScrollLeft + 4;
                float t = _top + mScrollTop + 4;
                canvas.drawRoundRect(new RectF(l, t, l + _w, t + _h), 20.0f, 20.0f, bubbleShadowPaint);
                Path path = new Path();
                float ox = _x + mScrollLeft + 1;
                float oy = _y + mScrollTop + 1;
                int yoffset = -35;
                if (_top > _y) {
                    yoffset = 35;
                }
                // draw shadow of pointer to origin
                path.moveTo(ox, oy);
                path.lineTo(ox - 5, oy + yoffset);
                path.lineTo(ox + 5 + 4, oy + yoffset);
                path.lineTo(ox, oy);
                path.close();
                canvas.drawPath(path, bubbleShadowPaint);

                // draw the bubble
                l = _left + mScrollLeft;
                t = _top + mScrollTop;
            if (isBooked) {
                canvas.drawRoundRect(new RectF(l, t, l + _w, t + _h), 20.0f, 20.0f, bookedBubblePaint);
            } else {
                canvas.drawRoundRect(new RectF(l, t, l + _w, t + _h), 20.0f, 20.0f, bubblePaint);
            }

                path = new Path();
                ox = _x + mScrollLeft;
                oy = _y + mScrollTop;
                yoffset = -35;
                if (_top > _y) {
                    yoffset = 35;
                }
                // draw pointer to origin
                path.moveTo(ox, oy);
                path.lineTo(ox - 5, oy + yoffset);
                path.lineTo(ox + 5, oy + yoffset);
                path.lineTo(ox, oy);
                path.close();
            if (isBooked) {
                canvas.drawPath(path, bookedBubblePaint);
            } else {
                canvas.drawPath(path, bubblePaint);
            }


                // draw the message
                canvas.drawText(_text, l + (_w / 2), t + _baseline - 10, textPaint);
            }
        }

按如下方式更改initDrawingTools

private void initDrawingTools() {
        textPaint = new Paint();
        textPaint.setColor(0xFF000000);
        textPaint.setTextSize(30);
        textPaint.setTypeface(Typeface.SERIF);
        textPaint.setTextAlign(Paint.Align.CENTER);
        textPaint.setAntiAlias(true);

        textOutlinePaint = new Paint();
        textOutlinePaint.setColor(0xFF000000);
        textOutlinePaint.setTextSize(18);
        textOutlinePaint.setTypeface(Typeface.SERIF);
        textOutlinePaint.setTextAlign(Paint.Align.CENTER);
        textOutlinePaint.setStyle(Paint.Style.STROKE);
        textOutlinePaint.setStrokeWidth(2);

        bubblePaint = new Paint();
        bubblePaint.setColor(Color.GREEN);
        bubbleShadowPaint = new Paint();
        bubbleShadowPaint.setColor(0xFF000000);
        bookedBubblePaint= new Paint();
        bookedBubblePaint.setColor(Color.RED);
    }

    public void addBubble(String text, int areaId) {
        if (mBubbleMap.get(areaId) == null) {
            Bubble b = new Bubble(text, areaId);
            mBubbleMap.put(areaId, b);
        }
    }

    public void addBookedBubble(String text, int areaId) {
        if (bookedBubble.get(areaId) == null) {
            Bubble b = new Bubble(text, areaId);
            bookedBubble.put(areaId, b);
        }
    }

希望这有助于您继续前进。