Ví dụ này thêm và định cấu hình đa tuyến trên bản đồ, chẳng hạn như để biểu thị một tuyến đường chỉ dẫn trên bản đồ.
Để biết thêm thông tin, hãy xem tài liệu.
Bắt đầu
Trước khi có thể thử mã mẫu, bạn phải định cấu hình môi trường phát triển. Để biết thêm thông tin, hãy xem Mã mẫu SDK Bản đồ dành cho Android.
Xem mã
Kotlin
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(com.example.common_ui.R.layout.polyline_demo) hueBar = findViewById<SeekBar>(com.example.common_ui.R.id.hueSeekBar).apply { max = MAX_HUE_DEGREES progress = 0 } alphaBar = findViewById<SeekBar>(com.example.common_ui.R.id.alphaSeekBar).apply { max = MAX_ALPHA progress = MAX_ALPHA } widthBar = findViewById<SeekBar>(com.example.common_ui.R.id.widthSeekBar).apply { max = MAX_WIDTH_PX progress = MAX_WIDTH_PX / 2 } startCapSpinner = findViewById<Spinner>(com.example.common_ui.R.id.startCapSpinner).apply { adapter = ArrayAdapter(this@PolylineDemoActivity, android.R.layout.simple_spinner_item, getResourceStrings(capTypeNameResourceIds)) } endCapSpinner = findViewById<Spinner>(com.example.common_ui.R.id.endCapSpinner).apply { adapter = ArrayAdapter(this@PolylineDemoActivity, android.R.layout.simple_spinner_item, getResourceStrings(capTypeNameResourceIds)) } jointTypeSpinner = findViewById<Spinner>(com.example.common_ui.R.id.jointTypeSpinner).apply { adapter = ArrayAdapter(this@PolylineDemoActivity, android.R.layout.simple_spinner_item, getResourceStrings(jointTypeNameResourceIds)) } patternSpinner = findViewById<Spinner>(com.example.common_ui.R.id.patternSpinner).apply { adapter = ArrayAdapter( this@PolylineDemoActivity, android.R.layout.simple_spinner_item, getResourceStrings(patternTypeNameResourceIds)) } clickabilityCheckbox = findViewById<CheckBox>(com.example.common_ui.R.id.toggleClickability) val mapFragment = supportFragmentManager.findFragmentById(com.example.common_ui.R.id.map) as SupportMapFragment mapFragment.getMapAsync(this) applyInsets(findViewById<View?>(com.example.common_ui.R.id.map_container)) } override fun onMapReady(googleMap: GoogleMap) { googleMap with(googleMap) { // Override the default content description on the view, for accessibility mode. setContentDescription(getString(com.example.common_ui.R.string.polyline_demo_description)) // A geodesic polyline that goes around the world. addPolyline(PolylineOptions().apply { add(lhrLatLng, aklLatLng, laxLatLng, jfkLatLng, lhrLatLng) width(INITIAL_STROKE_WIDTH_PX.toFloat()) color(Color.BLUE) geodesic(true) clickable(clickabilityCheckbox.isChecked) }) // Move the googleMap so that it is centered on the mutable polyline. moveCamera(CameraUpdateFactory.newLatLngZoom(melbourneLatLng, 3f)) // Add a listener for polyline clicks that changes the clicked polyline's color. setOnPolylineClickListener { polyline -> // Flip the values of the red, green and blue components of the polyline's color. polyline.color = polyline.color xor 0x00ffffff } } // A simple polyline across Australia. This polyline will be mutable. mutablePolyline = googleMap.addPolyline(PolylineOptions().apply{ color(Color.HSVToColor( alphaBar.progress, floatArrayOf(hueBar.progress.toFloat(), 1f, 1f))) width(widthBar.progress.toFloat()) clickable(clickabilityCheckbox.isChecked) add(melbourneLatLng, adelaideLatLng, perthLatLng, darwinLatLng) }) arrayOf(hueBar, alphaBar, widthBar).map { it.setOnSeekBarChangeListener(this) } arrayOf(startCapSpinner, endCapSpinner, jointTypeSpinner, patternSpinner).map { it.onItemSelectedListener = this } with(mutablePolyline) { startCap = getSelectedCap(startCapSpinner.selectedItemPosition) ?: ButtCap() endCap = getSelectedCap(endCapSpinner.selectedItemPosition) ?: ButtCap() jointType = getSelectedJointType(jointTypeSpinner.selectedItemPosition) pattern = getSelectedPattern(patternSpinner.selectedItemPosition) } clickabilityCheckbox.setOnClickListener { view -> mutablePolyline.isClickable = (view as CheckBox).isChecked } }
Java
public class PolylineDemoActivity extends SamplesBaseActivity implements OnSeekBarChangeListener, OnItemSelectedListener, OnMapReadyCallback { // City locations for mutable polyline. private static final LatLng ADELAIDE = new LatLng(-34.92873, 138.59995); private static final LatLng DARWIN = new LatLng(-12.4258647, 130.7932231); private static final LatLng MELBOURNE = new LatLng(-37.81319, 144.96298); private static final LatLng PERTH = new LatLng(-31.95285, 115.85734); // Airport locations for geodesic polyline. private static final LatLng AKL = new LatLng(-37.006254, 174.783018); private static final LatLng JFK = new LatLng(40.641051, -73.777485); private static final LatLng LAX = new LatLng(33.936524, -118.377686); private static final LatLng LHR = new LatLng(51.471547, -0.460052); 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 CUSTOM_CAP_IMAGE_REF_WIDTH_PX = 50; private static final int INITIAL_STROKE_WIDTH_PX = 5; private static final int PATTERN_DASH_LENGTH_PX = 50; private static final int PATTERN_GAP_LENGTH_PX = 20; 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 Polyline mutablePolyline; private SeekBar hueBar; private SeekBar alphaBar; private SeekBar widthBar; private Spinner startCapSpinner; private Spinner endCapSpinner; private Spinner jointTypeSpinner; private Spinner patternSpinner; private CheckBox clickabilityCheckbox; // These are the options for polyline caps, joints and patterns. We use their // string resource IDs as identifiers. private static final int[] CAP_TYPE_NAME_RESOURCE_IDS = { com.example.common_ui.R.string.cap_butt, // Default com.example.common_ui.R.string.cap_round, com.example.common_ui.R.string.cap_square, com.example.common_ui.R.string.cap_image, }; private static final int[] JOINT_TYPE_NAME_RESOURCE_IDS = { com.example.common_ui.R.string.joint_type_default, // Default com.example.common_ui.R.string.joint_type_bevel, com.example.common_ui.R.string.joint_type_round, }; private static final int[] PATTERN_TYPE_NAME_RESOURCE_IDS = { com.example.common_ui.R.string.pattern_solid, // Default com.example.common_ui.R.string.pattern_dashed, com.example.common_ui.R.string.pattern_dotted, com.example.common_ui.R.string.pattern_mixed, }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(com.example.common_ui.R.layout.polyline_demo); hueBar = findViewById(com.example.common_ui.R.id.hueSeekBar); hueBar.setMax(MAX_HUE_DEGREES); hueBar.setProgress(0); alphaBar = findViewById(com.example.common_ui.R.id.alphaSeekBar); alphaBar.setMax(MAX_ALPHA); alphaBar.setProgress(MAX_ALPHA); widthBar = findViewById(com.example.common_ui.R.id.widthSeekBar); widthBar.setMax(MAX_WIDTH_PX); widthBar.setProgress(MAX_WIDTH_PX / 2); startCapSpinner = findViewById(com.example.common_ui.R.id.startCapSpinner); startCapSpinner.setAdapter(new ArrayAdapter<>( this, android.R.layout.simple_spinner_item, getResourceStrings(CAP_TYPE_NAME_RESOURCE_IDS))); endCapSpinner = findViewById(com.example.common_ui.R.id.endCapSpinner); endCapSpinner.setAdapter(new ArrayAdapter<>( this, android.R.layout.simple_spinner_item, getResourceStrings(CAP_TYPE_NAME_RESOURCE_IDS))); jointTypeSpinner = findViewById(com.example.common_ui.R.id.jointTypeSpinner); jointTypeSpinner.setAdapter(new ArrayAdapter<>( this, android.R.layout.simple_spinner_item, getResourceStrings(JOINT_TYPE_NAME_RESOURCE_IDS))); patternSpinner = findViewById(com.example.common_ui.R.id.patternSpinner); patternSpinner.setAdapter(new ArrayAdapter<>( this, android.R.layout.simple_spinner_item, getResourceStrings(PATTERN_TYPE_NAME_RESOURCE_IDS))); clickabilityCheckbox = findViewById(com.example.common_ui.R.id.toggleClickability); SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager().findFragmentById(com.example.common_ui.R.id.map); mapFragment.getMapAsync(this); applyInsets(findViewById(com.example.common_ui.R.id.map_container)); } @Override public void onMapReady(GoogleMap map) { // Override the default content description on the view, for accessibility mode. map.setContentDescription(getString(com.example.common_ui.R.string.polyline_demo_description)); // A geodesic polyline that goes around the world. map.addPolyline(new PolylineOptions() .add(LHR, AKL, LAX, JFK, LHR) .width(INITIAL_STROKE_WIDTH_PX) .color(Color.BLUE) .geodesic(true) .clickable(clickabilityCheckbox.isChecked())); // A simple polyline across Australia. This polyline will be mutable. int color = Color.HSVToColor( alphaBar.getProgress(), new float[]{hueBar.getProgress(), 1, 1}); mutablePolyline = map.addPolyline(new PolylineOptions() .color(color) .width(widthBar.getProgress()) .clickable(clickabilityCheckbox.isChecked()) .add(MELBOURNE, ADELAIDE, PERTH, DARWIN)); hueBar.setOnSeekBarChangeListener(this); alphaBar.setOnSeekBarChangeListener(this); widthBar.setOnSeekBarChangeListener(this); startCapSpinner.setOnItemSelectedListener(this); endCapSpinner.setOnItemSelectedListener(this); jointTypeSpinner.setOnItemSelectedListener(this); patternSpinner.setOnItemSelectedListener(this); mutablePolyline.setStartCap(getSelectedCap(startCapSpinner.getSelectedItemPosition())); mutablePolyline.setEndCap(getSelectedCap(endCapSpinner.getSelectedItemPosition())); mutablePolyline.setJointType(getSelectedJointType(jointTypeSpinner.getSelectedItemPosition())); mutablePolyline.setPattern(getSelectedPattern(patternSpinner.getSelectedItemPosition())); // Move the map so that it is centered on the mutable polyline. map.moveCamera(CameraUpdateFactory.newLatLngZoom(MELBOURNE, 3)); // Add a listener for polyline clicks that changes the clicked polyline's color. map.setOnPolylineClickListener(new GoogleMap.OnPolylineClickListener() { @Override public void onPolylineClick(Polyline polyline) { // Flip the values of the red, green and blue components of the polyline's color. polyline.setColor(polyline.getColor() ^ 0x00ffffff); } }); } }
Sao chép và chạy các mẫu
Bạn cần có Git để chạy mẫu này trên máy. Lệnh sau đây sẽ sao chép kho lưu trữ ứng dụng mẫu.
git clone git@github.com:googlemaps-samples/android-samples.git
Nhập dự án mẫu vào Android Studio:
- Trong Android Studio, hãy chọn File > New > Import Project (Tệp > Mới > Nhập dự án).
Chuyển đến vị trí bạn đã lưu kho lưu trữ và chọn thư mục dự án cho Kotlin hoặc Java:
- Kotlin:
PATH-REPO/android-samples/ApiDemos/kotlin
- Java:
PATH-REPO/android-samples/ApiDemos/java
- Kotlin:
- Chọn Mở. Android Studio sẽ tạo dự án của bạn bằng công cụ bản dựng Gradle.
- Tạo một tệp
secrets.properties
trống trong cùng thư mục với tệplocal.properties
của dự án. Để biết thêm thông tin về tệp này, hãy xem phần Thêm khoá API vào dự án. - Lấy khoá API từ dự án của bạn bằng cách bật SDK Bản đồ dành cho Android.
Thêm chuỗi sau vào
secrets.properties
, thay thế YOUR_API_KEY bằng giá trị của khoá API:MAPS_API_KEY=YOUR_API_KEY
- Chạy ứng dụng.