Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/yazan98/markdown-compose
Android Library to Render Markdown Strings Inside Jetpack Compose
https://github.com/yazan98/markdown-compose
android-application android-library jetpack jetpack-compose jetpack-compose-library markdown markdown-renderer
Last synced: 2 months ago
JSON representation
Android Library to Render Markdown Strings Inside Jetpack Compose
- Host: GitHub
- URL: https://github.com/yazan98/markdown-compose
- Owner: Yazan98
- License: apache-2.0
- Created: 2022-06-25T12:57:28.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-07-15T10:36:32.000Z (over 1 year ago)
- Last Synced: 2024-10-30T22:40:30.946Z (2 months ago)
- Topics: android-application, android-library, jetpack, jetpack-compose, jetpack-compose-library, markdown, markdown-renderer
- Language: Kotlin
- Homepage:
- Size: 151 KB
- Stars: 11
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Markdown Render Composable
Android Library To Render Markdown Strings Inside Jetpack Compose Applications
Built With Native Jetpack Compose Composables
## Library Versions
1. Jetpack Compose : 1.3.1
2. Image Loading Library (Coil) : 2.1.0
3. Minumum Sdk Version : 24
4. Target Sdk Version : 32
5. Jetpack Compose UI : 1.1.1
## Installation
```
allprojects {
repositories {
mavenCentral()
}
}
```
```
dependencies {
implementation "com.yazantarifi:markdown-compose:1.0.4"
}
```
## Implementation
1. Basic Implementation
```kotlin
MarkdownViewComposable(
modifier = Modifier.fillMaxWidth().padding(10.dp),
content = content,
config = MarkdownConfig(
isLinksClickable = true,
isImagesClickable = true,
isScrollEnabled = false
)
) { link, type ->
// Callback on Click on Images, Links To Redirect to Image Viewer or WebView Screen
}
```
2. Color Control Example
```kotlin
MarkdownViewComposable(
modifier = Modifier.fillMaxWidth().padding(10.dp),
content = content,
config = MarkdownConfig(
isLinksClickable = true,
isImagesClickable = true,
isScrollEnabled = false,
colors = HashMap().apply {
this[MarkdownConfig.CHECKBOX_COLOR] = Color.Black
this[MarkdownConfig.LINKS_COLOR] = Color.Blue
this[MarkdownConfig.TEXT_COLOR] = Color.Gray
this[MarkdownConfig.HASH_TEXT_COLOR] = Color.Black
this[MarkdownConfig.CODE_BACKGROUND_COLOR] = Color.Gray
this[MarkdownConfig.CODE_BLOCK_TEXT_COLOR] = Color.White
}
)
) { link, type ->
when (type) {
MarkdownConfig.IMAGE_TYPE -> {} // Image Clicked
MarkdownConfig.LINK_TYPE -> {} // Link Clicked
}
}
```
## Config Description
| Attribute | Description |
|----------|:-------------:|
| isLinksClickable | Allow Links in View to be Clickable |
| isImagesClickable | Allow Images in View to be Clickable |
| isScrollEnabled | Allow Md View To be Scrollable Inside itself (False if it's already inside Scroll View or LazyColumn) |
| colors | Pass Colors Based on Your Application Theme |
| MarkdownConfig.CHECKBOX_COLOR | The Color of Checkboxes When Checkbox is Checked |
| MarkdownConfig.LINKS_COLOR | The Color of Links |
| MarkdownConfig.TEXT_COLOR | Normal Text Color |
| MarkdownConfig.HASH_TEXT_COLOR | Hashes Text Color (#, ##, ###, ####) |
| MarkdownConfig.CODE_BACKGROUND_COLOR | Background of Code Block |
| MarkdownConfig.CODE_BLOCK_TEXT_COLOR | Text Color Inside Code Block
## Screenshots
| Images 1 | Images 2 | Images 3 |
|----------|:-------------:|------:|
|  |  |  |
| |  |  |
## Supported Types
1. Hash Texts
2. Code Blocks
3. Text
4. Checkbox
5. Images
6. Shilds
7. Bold Text
8. Italic Text
9. Links
10. Space
## Publish Commands
```
gradle build
gradle library:publishReleasePublicationToSonatypeRepository
```
## License
Copyright (C) 2022 Markdown Compose is An Open Source Library (Licensed under the Apache License, Version 2.0)