Style features with custom dictionary

/* Copyright 2025 Esri
 *
 * 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.
 *
 */
package com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary

import android.content.Intent
import android.os.Bundle
import com.esri.arcgismaps.sample.sampleslib.DownloaderActivity

class DownloadActivity : DownloaderActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        downloadAndStartSample(
            Intent(this, MainActivity::class.java),
            getString(R.string.style_features_with_custom_dictionary_app_name),
            listOf(
                "https://www.arcgis.com/home/item.html?id=751138a2e0844e06853522d54103222a",
            )
        )
    }
}

/* Copyright 2025 Esri
 *
 * 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.
 *
 */

package com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable
import com.arcgismaps.ApiKey
import com.arcgismaps.ArcGISEnvironment
import com.esri.arcgismaps.sample.sampleslib.theme.SampleAppTheme
import com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.screens.StyleFeaturesWithCustomDictionaryScreen

class MainActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // authentication with an API key or named user is
        // required to access basemaps and other location services
        ArcGISEnvironment.apiKey = ApiKey.create(BuildConfig.ACCESS_TOKEN)

        setContent {
            SampleAppTheme {
                StyleFeaturesWithCustomDictionaryApp()
            }
        }
    }

    @Composable
    private fun StyleFeaturesWithCustomDictionaryApp() {
        Surface(color = MaterialTheme.colorScheme.background) {
            StyleFeaturesWithCustomDictionaryScreen(
                sampleName = getString(R.string.style_features_with_custom_dictionary_app_name)
            )
        }
    }
}

/* Copyright 2025 Esri
 *
 * 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.
 *
 */

package com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.components

import android.app.Application
import androidx.lifecycle.AndroidViewModel
import androidx.lifecycle.viewModelScope
import com.arcgismaps.mapping.ArcGISMap
import com.arcgismaps.mapping.BasemapStyle
import com.arcgismaps.mapping.Viewpoint
import com.arcgismaps.mapping.layers.FeatureLayer
import com.arcgismaps.mapping.symbology.DictionaryRenderer
import com.arcgismaps.mapping.symbology.DictionarySymbolStyle
import com.arcgismaps.portal.Portal
import com.arcgismaps.mapping.PortalItem
import com.arcgismaps.data.ServiceFeatureTable
import com.esri.arcgismaps.sample.sampleslib.components.MessageDialogViewModel
import com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.R
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.launch
import java.io.File

private const val RESTAURANTS_SERVICE_URL =
    "https://services2.arcgis.com/ZQgQTuoyBrtmoGdP/arcgis/rest/services/Redlands_Restaurants/FeatureServer/0"
private const val WEB_STYLE_ITEM_ID = "adee951477014ec68d7cf0ea0579c800"

class StyleFeaturesWithCustomDictionaryViewModel(app: Application) : AndroidViewModel(app) {

    // Feature layer showing restaurant data in Redlands, CA
    private val restaurantFeatureLayer = FeatureLayer.createWithFeatureTable(
        featureTable = ServiceFeatureTable(uri = RESTAURANTS_SERVICE_URL)
    )
    var arcGISMap = ArcGISMap(BasemapStyle.ArcGISTopographic).apply {
        initialViewpoint = Viewpoint(
            latitude = 34.0543,
            longitude = -117.1963,
            scale = 1e4
        )
    }
    private var dictionaryRendererFromStyleFile: DictionaryRenderer? = null
    private var dictionaryRendererFromWebStyle: DictionaryRenderer? = null

    private val _selectedStyle = MutableStateFlow(CustomDictionaryStyle.StyleFile)

    val messageDialogVM = MessageDialogViewModel()
    private val provisionPath: String by lazy {
        app.getExternalFilesDir(null)?.path.toString() + File.separator + app.getString(R.string.style_features_with_custom_dictionary_app_name)
    }

    init {
        viewModelScope.launch {
            // Prepare the dictionary renderer from the style file
            dictionaryRendererFromStyleFile = createDictionaryRendererFromStyleFile()
            // Prepare the dictionary renderer from the web style
            dictionaryRendererFromWebStyle = createDictionaryRendererFromWebStyle().getOrElse {
                messageDialogVM.showMessageDialog(it)
                return@launch
            }

            // Apply the renderer for the initially selected style
            applyRendererForSelectedStyle()

            // Add the restaurant layer to the map and load the map
            arcGISMap.apply {
                operationalLayers.add(restaurantFeatureLayer)
            }.load().onFailure {
                messageDialogVM.showMessageDialog(it)
            }
        }
    }

    /**
     * Update the current dictionary style selection and apply the renderer to the feature layer.
     */
    fun updateSelectedStyle(style: CustomDictionaryStyle) {
        _selectedStyle.value = style
        applyRendererForSelectedStyle()
    }

    /**
     * Apply the dictionary renderer to the restaurants layer.
     */
    private fun applyRendererForSelectedStyle() {
        restaurantFeatureLayer.renderer = when (_selectedStyle.value) {
            CustomDictionaryStyle.StyleFile -> dictionaryRendererFromStyleFile
            CustomDictionaryStyle.WebStyle -> dictionaryRendererFromWebStyle
        }
    }

    /**
     * Create a dictionary renderer from the style file included in the app's assets.
     */
    private fun createDictionaryRendererFromStyleFile(): DictionaryRenderer {
        val restaurantsStyleFile = File(provisionPath, "Restaurant.stylx")
        check(restaurantsStyleFile.exists()) {
            "Style file not found. Expected at: ${restaurantsStyleFile.canonicalPath}"
        }
        val restaurantStyle = DictionarySymbolStyle.createFromFile(restaurantsStyleFile.path)

        return DictionaryRenderer(dictionarySymbolStyle = restaurantStyle)
    }

    /**
     * Create a dictionary renderer from the web style hosted as a Portal item.
     * Maps the feature layer's field "healthgrade" to the dictionary style's expected field "Inspection".
     */
    private suspend fun createDictionaryRendererFromWebStyle(): Result<DictionaryRenderer> {
        val portal = Portal(url = "https://www.arcgis.com")
        val portalItem = PortalItem(portal = portal, itemId = WEB_STYLE_ITEM_ID)
        val restaurantSymbolStyle = DictionarySymbolStyle(portalItem).apply {
            load().getOrElse {
                return Result.failure(it)
            }
        }

        return Result.success(
            DictionaryRenderer(
                dictionarySymbolStyle = restaurantSymbolStyle,
                symbologyFieldOverrides = mapOf("healthgrade" to "Inspection")
            )
        )
    }
}

/**
 * Enum representing the two custom dictionary styles available in this sample.
 */
enum class CustomDictionaryStyle {
    StyleFile,
    WebStyle
}

/* Copyright 2025 Esri
 *
 * 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.
 *
 */

package com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.screens

import androidx.compose.foundation.basicMarquee
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.SegmentedButton
import androidx.compose.material3.SegmentedButtonDefaults
import androidx.compose.material3.SingleChoiceSegmentedButtonRow
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import com.arcgismaps.toolkit.geoviewcompose.MapView
import com.esri.arcgismaps.sample.sampleslib.components.MessageDialog
import com.esri.arcgismaps.sample.sampleslib.components.SampleTopAppBar
import com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.components.CustomDictionaryStyle
import com.esri.arcgismaps.sample.stylefeatureswithcustomdictionary.components.StyleFeaturesWithCustomDictionaryViewModel

/**
 * Main screen showcasing the dictionary renderer toggle between style file and web style.
 */
@Composable
fun StyleFeaturesWithCustomDictionaryScreen(sampleName: String) {
    val mapViewModel: StyleFeaturesWithCustomDictionaryViewModel = viewModel()

    Scaffold(
        topBar = { SampleTopAppBar(title = sampleName) },
        content = { paddingValues ->
            Column(
                modifier = Modifier
                    .fillMaxSize()
                    .padding(paddingValues)
            ) {
                MapView(
                    modifier = Modifier
                        .fillMaxSize()
                        .weight(1f),
                    arcGISMap = mapViewModel.arcGISMap
                )

                DictionaryStyleToggle(
                    modifier = Modifier
                        .fillMaxWidth()
                        .padding(16.dp),
                    onStyleSelected = mapViewModel::updateSelectedStyle
                )
            }

            // Displays a dialog when sample encounters an error
            mapViewModel.messageDialogVM.apply {
                if (dialogStatus) {
                    MessageDialog(
                        title = messageTitle,
                        description = messageDescription,
                        onDismissRequest = ::dismissDialog
                    )
                }
            }
        }
    )
}

/**
 * A segmented control to switch between Style File and Web Style dictionary renderers.
 */
@Composable
private fun DictionaryStyleToggle(
    modifier: Modifier = Modifier,
    onStyleSelected: (CustomDictionaryStyle) -> Unit
) {
    var currentSelectionIndex by remember { mutableIntStateOf(0) }

    Column(
        modifier = modifier,
        verticalArrangement = Arrangement.spacedBy(12.dp),
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Text(text = "Dictionary Symbol Style", style = MaterialTheme.typography.titleMedium)
        SingleChoiceSegmentedButtonRow(modifier = Modifier.fillMaxWidth()) {
            val options = listOf("Style File", "Web Style")
            options.forEachIndexed { index, label ->
                SegmentedButton(
                    shape = SegmentedButtonDefaults.itemShape(index = index, count = options.size),
                    onClick = {
                        currentSelectionIndex = index
                        val newStyle =
                            if (index == 0) CustomDictionaryStyle.StyleFile else CustomDictionaryStyle.WebStyle
                        onStyleSelected(newStyle)
                    },
                    selected = (index == currentSelectionIndex)
                ) {
                    Text(
                        modifier = Modifier.basicMarquee(),
                        text = label,
                        maxLines = 1
                    )
                }
            }
        }
    }
}