Browse Source

Add Icons preview.

pull/1392/head
Benoit Marty 1 year ago
parent
commit
45d45ecc87
  1. 144
      libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/icons/IconsList.kt
  2. 118
      libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/icons/IconsPreview.kt

144
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/icons/IconsList.kt

@ -0,0 +1,144 @@ @@ -0,0 +1,144 @@
/*
* Copyright (c) 2023 New Vector Ltd
*
* 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 io.element.android.libraries.designsystem.icons
import io.element.android.libraries.designsystem.R
internal val iconsCompound = listOf(
R.drawable.ic_compound_arrow_left,
R.drawable.ic_compound_arrow_right,
R.drawable.ic_compound_arrow_up_right,
R.drawable.ic_compound_block,
R.drawable.ic_compound_chat,
R.drawable.ic_compound_chat_new,
R.drawable.ic_compound_chat_problem,
R.drawable.ic_compound_check,
R.drawable.ic_compound_check_circle,
R.drawable.ic_compound_chevron_down,
R.drawable.ic_compound_chevron_left,
R.drawable.ic_compound_chevron_right,
R.drawable.ic_compound_chevron_up_down,
R.drawable.ic_compound_close,
R.drawable.ic_compound_computer,
R.drawable.ic_compound_delete,
R.drawable.ic_compound_download,
R.drawable.ic_compound_drag_grid,
R.drawable.ic_compound_drag_list,
R.drawable.ic_compound_end_call,
R.drawable.ic_compound_error,
R.drawable.ic_compound_export_archive,
R.drawable.ic_compound_extensions,
R.drawable.ic_compound_favourite_off,
R.drawable.ic_compound_favourite_on,
R.drawable.ic_compound_files,
R.drawable.ic_compound_filter,
R.drawable.ic_compound_grid_view,
R.drawable.ic_compound_info,
R.drawable.ic_compound_leave,
R.drawable.ic_compound_link,
R.drawable.ic_compound_lock,
R.drawable.ic_compound_lock_off,
R.drawable.ic_compound_marker_read_receipts,
R.drawable.ic_compound_mention,
R.drawable.ic_compound_mic_off_outline,
R.drawable.ic_compound_mic_off_solid,
R.drawable.ic_compound_mic_on_outline,
R.drawable.ic_compound_mic_on_solid,
R.drawable.ic_compound_mobile,
R.drawable.ic_compound_notifications,
R.drawable.ic_compound_notifications_off,
R.drawable.ic_compound_notifications_solid,
R.drawable.ic_compound_notifications_solid_off,
R.drawable.ic_compound_offline,
R.drawable.ic_compound_overflow_horizontal,
R.drawable.ic_compound_overflow_vertical,
R.drawable.ic_compound_polls,
R.drawable.ic_compound_pop_out,
R.drawable.ic_compound_public,
R.drawable.ic_compound_search,
R.drawable.ic_compound_settings,
R.drawable.ic_compound_settings_solid,
R.drawable.ic_compound_share,
R.drawable.ic_compound_share_android,
R.drawable.ic_compound_share_screen_outline,
R.drawable.ic_compound_share_screen_solid,
R.drawable.ic_compound_spotlight_view,
R.drawable.ic_compound_threads,
R.drawable.ic_compound_threads_solid,
R.drawable.ic_compound_user_add,
R.drawable.ic_compound_user_add_solid,
R.drawable.ic_compound_user_profile,
R.drawable.ic_compound_verified,
R.drawable.ic_compound_video_call,
R.drawable.ic_compound_video_call_declined,
R.drawable.ic_compound_video_call_missed,
R.drawable.ic_compound_video_call_off,
R.drawable.ic_compound_visibility_off,
R.drawable.ic_compound_visibility_on,
R.drawable.ic_compound_voice_call,
R.drawable.ic_compound_web_browser,
)
internal val iconsSeptember = listOf(
R.drawable.ic_september_add_reaction,
R.drawable.ic_september_attachment,
R.drawable.ic_september_compose_button,
R.drawable.ic_september_copy,
R.drawable.ic_september_decryption_error,
R.drawable.ic_september_edit_outline,
R.drawable.ic_september_edit_solid_16,
R.drawable.ic_september_forward,
R.drawable.ic_september_location,
R.drawable.ic_september_photo_camera,
R.drawable.ic_september_photo_video_library,
R.drawable.ic_september_reply,
R.drawable.ic_september_send,
R.drawable.ic_september_take_photo_camera,
R.drawable.ic_september_text_formatting,
R.drawable.ic_september_video_call,
R.drawable.ic_september_view_source,
)
internal val iconsOther = listOf(
R.drawable.ic_content_copy,
R.drawable.ic_delete,
R.drawable.ic_developer_mode,
R.drawable.ic_door_open_24,
R.drawable.ic_edit,
R.drawable.ic_edit_square,
R.drawable.ic_forward,
R.drawable.ic_groups,
R.drawable.ic_indent_decrease,
R.drawable.ic_indent_increase,
R.drawable.ic_inline_code,
R.drawable.ic_italic,
R.drawable.ic_link,
R.drawable.ic_mention,
R.drawable.ic_mute,
R.drawable.ic_numbered_list,
R.drawable.ic_plus,
R.drawable.ic_poll,
R.drawable.ic_poll_end,
R.drawable.ic_quote,
R.drawable.ic_reply,
R.drawable.ic_report_content,
R.drawable.ic_search,
R.drawable.ic_share,
R.drawable.ic_strikethrough,
R.drawable.ic_thread_decoration,
R.drawable.ic_underline,
)

118
libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/icons/IconsPreview.kt

@ -0,0 +1,118 @@ @@ -0,0 +1,118 @@
/*
* Copyright (c) 2023 New Vector Ltd
*
* 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 io.element.android.libraries.designsystem.icons
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import io.element.android.libraries.designsystem.preview.DayNightPreviews
import io.element.android.libraries.designsystem.preview.ElementPreview
import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.theme.ElementTheme
@DayNightPreviews
@Composable
internal fun IconsCompoundPreview() = ElementPreview {
IconsPreview(
title = "R.drawable.ic_compound_*",
iconsList = iconsCompound,
iconNameTransform = { name ->
name.removePrefix("ic_compound_")
.replace("_", " ")
})
}
@DayNightPreviews
@Composable
internal fun IconsSeptemberPreview() = ElementPreview {
IconsPreview(
title = "R.drawable.ic_september_*",
iconsList = iconsSeptember,
iconNameTransform = { name ->
name.removePrefix("ic_september_")
.replace("_", " ")
})
}
@DayNightPreviews
@Composable
internal fun IconsOtherPreview() = ElementPreview {
IconsPreview(
title = "R.drawable.ic_*",
iconsList = iconsOther,
iconNameTransform = { name ->
name.removePrefix("ic_")
.replace("_", " ")
})
}
@Composable
private fun IconsPreview(
title: String,
iconsList: List<Int>,
iconNameTransform: (String) -> String,
modifier: Modifier = Modifier,
) = ElementPreview {
val context = LocalContext.current
Column(
modifier = modifier,
verticalArrangement = Arrangement.spacedBy(2.dp),
) {
Text(
modifier = Modifier.fillMaxWidth(),
style = ElementTheme.typography.fontHeadingSmMedium,
text = title,
textAlign = TextAlign.Center,
)
iconsList.chunked(8).forEach { iconsRow ->
Row(horizontalArrangement = Arrangement.spacedBy(1.dp)) {
iconsRow.forEach { icon ->
Column(
modifier = Modifier.width(48.dp),
horizontalAlignment = Alignment.CenterHorizontally,
) {
Icon(
modifier = Modifier.padding(2.dp),
resourceId = icon,
contentDescription = null,
)
Text(
text = iconNameTransform(
context.resources
.getResourceEntryName(icon)
),
modifier = Modifier.fillMaxWidth(),
textAlign = TextAlign.Center,
style = ElementTheme.typography.fontBodyXsMedium,
color = ElementTheme.colors.textSecondary,
)
}
}
}
}
}
}
Loading…
Cancel
Save