En este ejemplo, se muestra cómo dibujar polígonos de distintas formas y colores en un mapa.
Para obtener más información, consulta la documentación.
Comenzar
Antes de probar el código de muestra, debes configurar tu entorno de desarrollo. Para obtener más información, consulta Muestras de código del SDK de Maps SDK para Android.
Consulta el código
Kotlin
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.polygon_demo)
fillHueBar = findViewById<SeekBar>(R.id.fillHueSeekBar).apply {
max = MAX_HUE_DEGREES
progress = MAX_HUE_DEGREES / 2
}
fillAlphaBar = findViewById<SeekBar>(R.id.fillAlphaSeekBar).apply {
max = MAX_ALPHA
progress = MAX_ALPHA / 2
}
strokeWidthBar = findViewById<SeekBar>(R.id.strokeWidthSeekBar).apply {
max = MAX_WIDTH_PX
progress = MAX_WIDTH_PX / 3
}
strokeHueBar = findViewById<SeekBar>(R.id.strokeHueSeekBar).apply {
max = MAX_HUE_DEGREES
progress = 0
}
strokeAlphaBar = findViewById<SeekBar>(R.id.strokeAlphaSeekBar).apply {
max = MAX_ALPHA
progress = MAX_ALPHA
}
strokeJointTypeSpinner = findViewById<Spinner>(R.id.strokeJointTypeSpinner).apply {
adapter = ArrayAdapter(
this@PolygonDemoActivity, android.R.layout.simple_spinner_item,
getResourceStrings(jointTypeNameResourceIds))
}
strokePatternSpinner = findViewById<Spinner>(R.id.strokePatternSpinner).apply {
adapter = ArrayAdapter(
this@PolygonDemoActivity, android.R.layout.simple_spinner_item,
getResourceStrings(patternTypeNameResourceIds))
}
clickabilityCheckbox = findViewById(R.id.toggleClickability)
val mapFragment = supportFragmentManager.findFragmentById(R.id.map) as SupportMapFragment
mapFragment.getMapAsync(this)
}
override fun onMapReady(googleMap: GoogleMap) {
// return early if the map was not initialised properly
googleMap ?: return
val fillColorArgb = Color.HSVToColor(
fillAlphaBar.progress, floatArrayOf(fillHueBar.progress.toFloat(), 1f, 1f))
val strokeColorArgb = Color.HSVToColor(
strokeAlphaBar.progress, floatArrayOf(strokeHueBar.progress.toFloat(), 1f, 1f))
with(googleMap) {
// Override the default content description on the view, for accessibility mode.
setContentDescription(getString(R.string.polygon_demo_description))
// Move the googleMap so that it is centered on the mutable polygon.
moveCamera(CameraUpdateFactory.newLatLngZoom(center, 4f))
// Create a rectangle with two rectangular holes.
mutablePolygon = addPolygon(PolygonOptions().apply {
addAll(createRectangle(center, 5.0, 5.0))
addHole(createRectangle(LatLng(-22.0, 128.0), 1.0, 1.0))
addHole(createRectangle(LatLng(-18.0, 133.0), 0.5, 1.5))
fillColor(fillColorArgb)
strokeColor(strokeColorArgb)
strokeWidth(strokeWidthBar.progress.toFloat())
clickable(clickabilityCheckbox.isChecked)
})
// Add a listener for polygon clicks that changes the clicked polygon's stroke color.
setOnPolygonClickListener { polygon ->
// Flip the red, green and blue components of the polygon's stroke color.
polygon.strokeColor = polygon.strokeColor xor 0x00ffffff
}
}
// set listeners on seekBars
arrayOf(fillHueBar, fillAlphaBar, strokeWidthBar, strokeHueBar, strokeAlphaBar).map {
it.setOnSeekBarChangeListener(this)
}
// set listeners on spinners
arrayOf(strokeJointTypeSpinner, strokePatternSpinner).map {
it.onItemSelectedListener = this
}
// set line pattern and joint type based on current spinner position
with(mutablePolygon) {
strokeJointType = getSelectedJointType(strokeJointTypeSpinner.selectedItemPosition)
strokePattern = getSelectedPattern(strokePatternSpinner.selectedItemPosition)
}
}
Java
public class PolygonDemoActivity extends AppCompatActivity
implements OnSeekBarChangeListener, OnItemSelectedListener, OnMapReadyCallback {
private static final LatLng CENTER = new LatLng(-20, 130);
private static final int MAX_WIDTH_PX = 100;
private static final int MAX_HUE_DEGREES = 360;
private static final int MAX_ALPHA = 255;
private static final int PATTERN_DASH_LENGTH_PX = 50;
private static final int PATTERN_GAP_LENGTH_PX = 10;
private static final Dot DOT = new Dot();
private static final Dash DASH = new Dash(PATTERN_DASH_LENGTH_PX);
private static final Gap GAP = new Gap(PATTERN_GAP_LENGTH_PX);
private static final List<PatternItem> PATTERN_DOTTED = Arrays.asList(DOT, GAP);
private static final List<PatternItem> PATTERN_DASHED = Arrays.asList(DASH, GAP);
private static final List<PatternItem> PATTERN_MIXED = Arrays.asList(DOT, GAP, DOT, DASH, GAP);
private Polygon mutablePolygon;
private SeekBar fillHueBar;
private SeekBar fillAlphaBar;
private SeekBar strokeWidthBar;
private SeekBar strokeHueBar;
private SeekBar strokeAlphaBar;
private Spinner strokeJointTypeSpinner;
private Spinner strokePatternSpinner;
private CheckBox clickabilityCheckbox;
// These are the options for polygon stroke joints and patterns. We use their
// string resource IDs as identifiers.
private static final int[] JOINT_TYPE_NAME_RESOURCE_IDS = {
R.string.joint_type_default, // Default
R.string.joint_type_bevel,
R.string.joint_type_round,
};
private static final int[] PATTERN_TYPE_NAME_RESOURCE_IDS = {
R.string.pattern_solid, // Default
R.string.pattern_dashed,
R.string.pattern_dotted,
R.string.pattern_mixed,
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.polygon_demo);
fillHueBar = findViewById(R.id.fillHueSeekBar);
fillHueBar.setMax(MAX_HUE_DEGREES);
fillHueBar.setProgress(MAX_HUE_DEGREES / 2);
fillAlphaBar = findViewById(R.id.fillAlphaSeekBar);
fillAlphaBar.setMax(MAX_ALPHA);
fillAlphaBar.setProgress(MAX_ALPHA / 2);
strokeWidthBar = findViewById(R.id.strokeWidthSeekBar);
strokeWidthBar.setMax(MAX_WIDTH_PX);
strokeWidthBar.setProgress(MAX_WIDTH_PX / 3);
strokeHueBar = findViewById(R.id.strokeHueSeekBar);
strokeHueBar.setMax(MAX_HUE_DEGREES);
strokeHueBar.setProgress(0);
strokeAlphaBar = findViewById(R.id.strokeAlphaSeekBar);
strokeAlphaBar.setMax(MAX_ALPHA);
strokeAlphaBar.setProgress(MAX_ALPHA);
strokeJointTypeSpinner = findViewById(R.id.strokeJointTypeSpinner);
strokeJointTypeSpinner.setAdapter(new ArrayAdapter<>(
this, android.R.layout.simple_spinner_item,
getResourceStrings(JOINT_TYPE_NAME_RESOURCE_IDS)));
strokePatternSpinner = findViewById(R.id.strokePatternSpinner);
strokePatternSpinner.setAdapter(new ArrayAdapter<>(
this, android.R.layout.simple_spinner_item,
getResourceStrings(PATTERN_TYPE_NAME_RESOURCE_IDS)));
clickabilityCheckbox = findViewById(R.id.toggleClickability);
SupportMapFragment mapFragment =
(SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map);
mapFragment.getMapAsync(this);
}
@Override
public void onMapReady(GoogleMap map) {
// Override the default content description on the view, for accessibility mode.
map.setContentDescription(getString(R.string.polygon_demo_description));
int fillColorArgb = Color.HSVToColor(
fillAlphaBar.getProgress(), new float[]{fillHueBar.getProgress(), 1, 1});
int strokeColorArgb = Color.HSVToColor(
strokeAlphaBar.getProgress(), new float[]{strokeHueBar.getProgress(), 1, 1});
// Create a rectangle with two rectangular holes.
mutablePolygon = map.addPolygon(new PolygonOptions()
.addAll(createRectangle(CENTER, 5, 5))
.addHole(createRectangle(new LatLng(-22, 128), 1, 1))
.addHole(createRectangle(new LatLng(-18, 133), 0.5, 1.5))
.fillColor(fillColorArgb)
.strokeColor(strokeColorArgb)
.strokeWidth(strokeWidthBar.getProgress())
.clickable(clickabilityCheckbox.isChecked()));
fillHueBar.setOnSeekBarChangeListener(this);
fillAlphaBar.setOnSeekBarChangeListener(this);
strokeWidthBar.setOnSeekBarChangeListener(this);
strokeHueBar.setOnSeekBarChangeListener(this);
strokeAlphaBar.setOnSeekBarChangeListener(this);
strokeJointTypeSpinner.setOnItemSelectedListener(this);
strokePatternSpinner.setOnItemSelectedListener(this);
mutablePolygon.setStrokeJointType(getSelectedJointType(strokeJointTypeSpinner.getSelectedItemPosition()));
mutablePolygon.setStrokePattern(getSelectedPattern(strokePatternSpinner.getSelectedItemPosition()));
// Move the map so that it is centered on the mutable polygon.
map.moveCamera(CameraUpdateFactory.newLatLngZoom(CENTER, 4));
// Add a listener for polygon clicks that changes the clicked polygon's stroke color.
map.setOnPolygonClickListener(new GoogleMap.OnPolygonClickListener() {
@Override
public void onPolygonClick(Polygon polygon) {
// Flip the red, green and blue components of the polygon's stroke color.
polygon.setStrokeColor(polygon.getStrokeColor() ^ 0x00ffffff);
}
});
}
}
Clona y ejecuta las muestras
Se requiere Git para ejecutar esta muestra a nivel local. Con el siguiente comando, se clona el repositorio de la aplicación de ejemplo.
git clone git@github.com:googlemaps-samples/android-samples.git
Importa el proyecto de muestra en Android Studio:
- En Android Studio, selecciona File > New > Import Project.
Ve a la ubicación en la que guardaste el repositorio y selecciona el directorio del proyecto para Kotlin o Java:
- Kotlin:
PATH-REPO/android-samples/ApiDemos/kotlin - Java:
PATH-REPO/android-samples/ApiDemos/java
- Kotlin:
- Selecciona Open. Android Studio creará tu proyecto con la herramienta de compilación Gradle.
- Crea un archivo
secrets.propertiesen blanco en el mismo directorio en el que se encuentra el archivolocal.propertiesde tu proyecto. Para obtener más información, consulta Agrega tu clave de API al proyecto. Agrega la siguiente cadena a
secrets.propertiesreemplazando YOUR_API_KEY con el valor de tu clave de API:MAPS_API_KEY=YOUR_API_KEY- Ejecuta la app.