How to display text in a custom brand

Question

I am trying to create a custom marker that displays text with a number equal to the example below:

Example:

But when you start the application, the text is not displayed, only a red ellipse appears without a number.

My code

InicializeMap () ##

private void InicializeMap() { if (_googleMap == null) { _googleMap = ((MapFragment) getFragmentManager().findFragmentById(R.id.mapMapeamento)).getMap(); LatLng pos = new LatLng(23.4555453556, 11.145315551); MapUtils mapUtils = new MapUtils(getApplicationContext()); Bitmap bitmap = mapUtils.GetBitmapMarker(); Marker marker = _googleMap.addMarker(new MarkerOptions() .position(pos) .icon(BitmapDescriptorFactory.fromBitmap(bitmap))); // check if map is created successfully or not if (_googleMap == null) Toast.makeText(getApplicationContext(), Mensagens.erroCriarMapa, Toast.LENGTH_SHORT).show(); } } 

---

My bitmap creation method

 public Bitmap GetBitmapMarker() { Paint color = new Paint(); color.setTextSize(35); color.setColor(Color.BLACK); int px = _mContext.getResources().getDimensionPixelSize(R.dimen.map_dot_marker_size); Bitmap mDotMarkerBitmap = Bitmap.createBitmap(px, px, Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(mDotMarkerBitmap); canvas.drawText("Hello!", 30, 40, color); Drawable shape = _mContext.getResources().getDrawable(R.drawable.shape_marker_red); shape.setBounds(0, 0, mDotMarkerBitmap.getWidth(), mDotMarkerBitmap.getHeight()); shape.draw(canvas); return mDotMarkerBitmap; } 

Res / draw / shape_marker_red

 <?xml version="1.0" encoding="utf-8"?> 

 <gradient android:angle="90" android:endColor="#f58383" android:startColor="#ee6464" /> <stroke android:width="1dp" android:color="#a13939" /> 

Answer 1

I got the following implementation and it worked. The implementation was as follows:

Class MapActivity

 MapUtils mapUtils = new MapUtils(getApplicationContext()); Bitmap bitmap = mapUtils.GetBitmapMarker(getApplicationContext(), R.drawable.marker_blue, "1"); Marker marker = _googleMap.addMarker(new MarkerOptions() .position(pos) .icon(BitmapDescriptorFactory.fromBitmap(bitmap))); 

Class MapUtils

 public Bitmap GetBitmapMarker(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; bitmap = bitmap.copy(bitmapConfig, true); Canvas canvas = new Canvas(bitmap); Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); paint.setColor(Color.WHITE); paint.setTextSize((int) (14 * scale)); 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())/2; int y = (bitmap.getHeight() + bounds.height())/2; canvas.drawText(mText, x * scale, y * scale, paint); return bitmap; } catch (Exception e) { return null; } } 

Answer 2

Here is what I came up with.

First declare your marker options to add a marker to the map.

 MarkerOptions options = new MarkerOptions() .position(new LatLng(GlobalApp.getInstance().getLoginUserInfo().getLatitude(), GlobalApp.getInstance().getLoginUserInfo().getLongitude())) .draggable(false) .flat(false) .icon(BitmapDescriptorFactory.fromBitmap(createStoreMarker())); Marker tempMarker = globalGoogleMap.addMarker(options); 

Add a function to inflate the layout of your specification, and you can get their link and add whatever you want. This is the place where magic happens.

 private Bitmap createStoreMarker() { View markerLayout = getLayoutInflater().inflate(R.layout.store_marker_layout, null); ImageView markerImage = (ImageView) markerLayout.findViewById(R.id.marker_image); TextView markerRating = (TextView) markerLayout.findViewById(R.id.marker_text); markerImage.setImageResource(R.drawable.ic_home_marker); markerRating.setText(GlobalApp.getInstance().getLoginUserInfo().getStoreName()); markerLayout.measure(View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED), View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED)); markerLayout.layout(0, 0, markerLayout.getMeasuredWidth(), markerLayout.getMeasuredHeight()); final Bitmap bitmap = Bitmap.createBitmap(markerLayout.getMeasuredWidth(), markerLayout.getMeasuredHeight(), Bitmap.Config.ARGB_8888); Canvas canvas = new Canvas(bitmap); markerLayout.draw(canvas); return bitmap; } 

This is the layout.

store_marker_layout.xml I am inflating

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/layout_store_marker" android:layout_width="wrap_content" android:layout_height="wrap_content" android:clickable="true" android:focusableInTouchMode="true" android:orientation="vertical"> <TextView android:id="@+id/marker_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:padding="8dp" android:text="dgdfgdfg" android:textColor="@android:color/black" android:textStyle="bold" /> <ImageView android:id="@+id/marker_image" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:src="@drawable/ic_home_marker" /> </LinearLayout> 

Answer 3

Why are you using bitmap here? It looks like drawable will do the job, and then you can programmatically change the .setText () of each variable depending on the purpose of the marker.

For example:

 <Button android:id="@+id/markerButton" android:background="@drawable/markerDrawable"/> 

Then:

 markerButton.setText("1"); 

Answer 4

Here you go. In this method, we create a BitmapDescriptor with the number of laps centered in one of the 3 drawings.

 /** * @param lapNbr String * @return {@link BitmapDescriptor} */ private BitmapDescriptor createLapBitMap(String lapNbr) { // Determine which of the 3 icons to start from. 1 being the thinnest, 3 being the widest. Bitmap tmp = null; switch (lapNbr.length()) { case 1: tmp = BitmapFactory.decodeResource(getResources(), R.drawable.lap_icon1); break; case 2: tmp = BitmapFactory.decodeResource(getResources(), R.drawable.lap_icon2); break; // If a dude is recording more than 999 laps, let just shoot him. :) default: tmp = BitmapFactory.decodeResource(getResources(), R.drawable.lap_icon3); break; } if (tmp != null) { Bitmap.Config config = tmp.getConfig(); if (config == null) { config = Bitmap.Config.ARGB_8888; } // Resource bitmpas are immutable, so we need to convert it to a mutable one. Bitmap bm = tmp.copy(config, true); if (bm != null) { // Draw text to the canvas center. Rect bounds = new Rect(); mLapIconPaint.getTextBounds(lapNbr, 0, lapNbr.length(), bounds); int x = (bm.getWidth() - bounds.width()) / 2; int y = ((bm.getHeight() + bounds.height()) / 2) - 10; // bump it up just a bit Canvas c = new Canvas(bm); c.drawText(lapNbr, x, y, mLapIconPaint); return BitmapDescriptorFactory.fromBitmap(bm); } } // Return a default bitmap with a lap circle inside of the icon. return BitmapDescriptorFactory.fromResource(R.drawable.lap_icon1); }