update documentation

Author: utsmannn

Diff for: .github/workflows/ci.yml

@@ -19,4 +19,5 @@ jobs:
           key: ${{ github.ref }}
           path: .cache
       - run: pip install mkdocs-material
+      - run: pip install mkdocs-glightbox
       - run: mkdocs gh-deploy --force

Diff for: app/src/main/java/com/utsman/osmapp/MainActivity.kt

@@ -99,6 +99,14 @@ fun MainGraph(
         composable(route = Route.Marker.routeArg) {
             MarkerPage()
         }
+
+        composable(route = Route.Polyline.routeArg) {
+            PolylinePage()
+        }
+
+        composable(route = Route.Polygon.routeArg) {
+            PolygonPage()
+        }
     }
 }
 
@@ -125,13 +133,24 @@ fun Main() {
         }
 
         Button(onClick = {
-            //navigation.goToSimpleNode()
+            navigation.goToPolyline()
         }) {
             Text(text = "Polyline")
         }
+
+        Button(onClick = {
+            navigation.goToPolygon()
+        }) {
+            Text(text = "Polygon")
+        }
     }
 }
 
+
+/**
+ * Playground
+ * */
+
 @Composable
 fun MarkerPage1() {
     val depokState = rememberMarkerState(geoPoint = GeoPoint(-6.3970066, 106.8224316))

Diff for: app/src/main/java/com/utsman/osmapp/MarkerPage.kt

@@ -1,30 +1,66 @@
 package com.utsman.osmapp
 
+import android.graphics.drawable.Drawable
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import com.utsman.osmandcompose.Marker
 import com.utsman.osmandcompose.OpenStreetMap
 import com.utsman.osmandcompose.rememberCameraState
 import com.utsman.osmandcompose.rememberMarkerState
 
 @Composable
 fun MarkerPage() {
+    val context = LocalContext.current
+
     val cameraState = rememberCameraState {
         geoPoint = Coordinates.depok
         zoom = 12.0
     }
 
     val depokMarkerState = rememberMarkerState(
-        geoPoint = Coordinates.depok
+        geoPoint = Coordinates.depok,
+        rotation = 90f
     )
 
+    val depokIcon: Drawable? by remember {
+        mutableStateOf(context.getDrawable(R.drawable.round_eject_24))
+    }
+
     OpenStreetMap(
         modifier = Modifier.fillMaxSize(),
         cameraState = cameraState
     ) {
         Marker(
-            state = depokMarkerState
-        )
+            state = depokMarkerState,
+            icon = depokIcon,
+            title = "Depok",
+            snippet = "Jawa barat"
+        ) {
+            Column(
+                modifier = Modifier
+                    .size(100.dp)
+                    .background(color = Color.Gray, shape = RoundedCornerShape(7.dp)),
+                verticalArrangement = Arrangement.Center,
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                Text(text = it.title)
+                Text(text = it.snippet, fontSize = 10.sp)
+            }
+        }
     }
 }

Diff for: app/src/main/java/com/utsman/osmapp/PolygonPage.kt

@@ -0,0 +1,39 @@
+package com.utsman.osmapp
+
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import com.utsman.osmandcompose.OpenStreetMap
+import com.utsman.osmandcompose.Polygon
+import com.utsman.osmandcompose.Polyline
+import com.utsman.osmandcompose.PolylineCap
+import com.utsman.osmandcompose.rememberCameraState
+
+@Composable
+fun PolygonPage() {
+
+    val cameraState = rememberCameraState {
+        geoPoint = Coordinates.depok
+        zoom = 12.0
+    }
+
+    val geoPoint = remember {
+        listOf(Coordinates.bekasi, Coordinates.depok, Coordinates.tangerang)
+    }
+
+    OpenStreetMap(
+        modifier = Modifier.fillMaxSize(),
+        cameraState = cameraState
+    ) {
+        Polygon(
+            geoPoints = geoPoint,
+            color = Color.Red,
+            width = 18f,
+            onPolygonLoaded = { outlinePaint, fillPaint ->
+
+            }
+        )
+    }
+}

Diff for: app/src/main/java/com/utsman/osmapp/PolylinePage.kt

@@ -0,0 +1,43 @@
+package com.utsman.osmapp
+
+import android.graphics.BlendModeColorFilter
+import android.graphics.PorterDuff
+import android.graphics.PorterDuffColorFilter
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.toArgb
+import com.utsman.osmandcompose.OpenStreetMap
+import com.utsman.osmandcompose.Polyline
+import com.utsman.osmandcompose.PolylineCap
+import com.utsman.osmandcompose.rememberCameraState
+
+@Composable
+fun PolylinePage() {
+
+    val cameraState = rememberCameraState {
+        geoPoint = Coordinates.depok
+        zoom = 12.0
+    }
+
+    val geoPoint = remember {
+        listOf(Coordinates.bekasi, Coordinates.depok, Coordinates.tangerang)
+    }
+
+    OpenStreetMap(
+        modifier = Modifier.fillMaxSize(),
+        cameraState = cameraState
+    ) {
+        Polyline(
+            geoPoints = geoPoint,
+            color = Color.Red,
+            cap = PolylineCap.ROUND,
+            width = 18f,
+            onPolylineLoaded = { paint ->
+               // customize here
+            }
+        )
+    }
+}

Diff for: app/src/main/java/com/utsman/osmapp/SimplePage.kt

@@ -2,19 +2,53 @@ package com.utsman.osmapp
 
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.SideEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import com.utsman.osmandcompose.DefaultMapProperties
+import com.utsman.osmandcompose.MapProperties
 import com.utsman.osmandcompose.OpenStreetMap
+import com.utsman.osmandcompose.ZoomButtonVisibility
 import com.utsman.osmandcompose.rememberCameraState
+import com.utsman.osmandcompose.rememberOverlayManagerState
+import org.osmdroid.tileprovider.tilesource.TileSourceFactory
+import org.osmdroid.views.overlay.CopyrightOverlay
 
 @Composable
 fun SimplePage() {
+    val context = LocalContext.current
+
     val cameraState = rememberCameraState {
         geoPoint = Coordinates.depok
         zoom = 12.0
     }
 
+    var mapProperties by remember {
+        mutableStateOf(DefaultMapProperties)
+    }
+
+    val overlayManagerState = rememberOverlayManagerState()
+
+    SideEffect {
+        mapProperties = mapProperties
+            .copy(isTilesScaledToDpi = true)
+            .copy(tileSources = TileSourceFactory.MAPNIK)
+            .copy(isEnableRotationGesture = true)
+            .copy(zoomButtonVisibility = ZoomButtonVisibility.NEVER)
+    }
+
     OpenStreetMap(
         modifier = Modifier.fillMaxSize(),
-        cameraState = cameraState
+        cameraState = cameraState,
+        properties = mapProperties,
+        overlayManagerState = overlayManagerState,
+        onFirstLoadListener = {
+            val copyright = CopyrightOverlay(context)
+            overlayManagerState.overlayManager.add(copyright)
+        }
     )
 }

Diff for: docs/getting-started.md

@@ -7,7 +7,14 @@
 
 ### Dependencies
 ```groovy
+// origin version of osm android. You may be able to customize the version.
+implementation 'org.osmdroid:osmdroid-android:6.1.16'
+
+// This library dependencies
 implementation "tech.utsmankece:osm-androd-compose:${latest_version}"
 ```
 
+## Example app
+For see fully example, visit [app module](https://github.com/utsmannn/osm-android-compose/tree/main/app/src/main/java/com/utsman/osmapp)
+
 ---

Diff for: docs/images/info-window.png

@@ -1,17 +1,25 @@
 # Welcome
 
-For full documentation visit [mkdocs.org](https://www.mkdocs.org).
+The origin OpenStreetMaps Android visit [https://osmdroid.github.io/osmdroid/](https://osmdroid.github.io/osmdroid/) or [github wiki](https://github.com/osmdroid/osmdroid/wiki)
 
-## Commands
+This is a simple OpenStreetMap library for Android Compose. There are several basic functions commonly used, such as markers, polylines, and polygons. You can also add custom tiles. For more details, please refer to the sample project.
 
-* `mkdocs new [dir-name]` - Create a new project.
-* `mkdocs serve` - Start the live-reloading docs server.
-* `mkdocs build` - Build the documentation site.
-* `mkdocs -h` - Print help message and exit.
+## Contributing
+This library may not always be maintained, and I am open to anyone who wants to contribute by reporting bugs, making pull requests, or requesting new features in the future.
 
-## Project layout
+## License
+```
+Copyright 2023 Muhammad Utsman
 
-    mkdocs.yml    # The configuration file.
-    docs/
-        index.md  # The documentation homepage.
-        ...       # Other markdown pages, images and other files.
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+     
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+```