33 KiB
Contributing
This guide have some instructions and tips on how to create a new Tachiyomi extension. Please read it carefully if you're a new contributor or don't have any experience on the required languages and knowledges.
This guide is not definitive and it's being updated over time. If you find any issue on it, feel free to report it through a Meta Issue or fixing it directly by submitting a Pull Request.
Table of Contents
Prerequisites
Before you start, please note that the ability to use following technologies is required and that existing contributors will not actively teach them to you.
- Basic Android development
- Kotlin
- Web scraping
Tools
- Android Studio
- Emulator or phone with developer options enabled and a recent version of Tachiyomi installed
- Icon Generator
Cloning the repository
Some alternative steps can be followed to ignore "repo" branch and skip unrelated sources, which will make it faster to pull, navigate and build. This will also reduce disk usage and network traffic.
Steps
-
Make sure to delete "repo" branch in your fork. You may also want to disable Actions in the repo settings.
Also make sure you are using the latest version of Git as many commands used here are pretty new.
-
Do a partial clone.
git clone --filter=blob:none --sparse <fork-repo-url> cd extensions/
-
Configure sparse checkout.
There are two modes of pattern matching. The default is cone (🔺) mode. Cone mode enables significantly faster pattern matching for big monorepos and the sparse index feature to make Git commands more responsive. In this mode, you can only filter by file path, which is less flexible and might require more work when the project structure changes.
You can skip this code block to use legacy mode if you want easier filters. It won't be much slower as the repo doesn't have that many files.
To enable cone mode together with sparse index, follow these steps:
git sparse-checkout set --cone --sparse-index # add project folders git sparse-checkout add .run buildSrc core gradle lib # add a single source git sparse-checkout add src/<lang>/<source>
To remove a source, open
.git/info/sparse-checkout
and delete the exact lines you typed when adding it. Don't touch the other auto-generated lines unless you fully understand how cone mode works, or you might break it.To use the legacy non-cone mode, follow these steps:
# enable sparse checkout git sparse-checkout set --no-cone # edit sparse checkout filter vim .git/info/sparse-checkout # alternatively, if you have VS Code installed code .git/info/sparse-checkout
Here's an example:
/* !/src/* # allow a single source /src/<lang>/<source> # or type the source name directly <source>
Explanation: the rules are like
gitignore
. We first exclude all sources while retaining project folders, then add the needed sources back manually. -
Configure remotes.
# add upstream git remote add upstream <tachiyomiorg-repo-url> # optionally disable push to upstream git remote set-url --push upstream no_pushing # ignore 'repo' branch of upstream # option 1: use negative refspec git config --add remote.upstream.fetch "^refs/heads/repo" # option 2: fetch main only (ignore all other branches) git config remote.upstream.fetch "+refs/heads/main:refs/remotes/upstream/main" # update remotes git remote update # track main of upstream instead of fork git branch main -u upstream/main
-
Useful configurations. (optional)
# prune obsolete remote branches on fetch git config remote.origin.prune true # fast-forward only when pulling main branch git config pull.ff only # Add an alias to sync main branch without fetching useless blobs. # If you run `git pull` to fast-forward in a blobless clone like this, # all blobs (files) in the new commits are still fetched regardless of # sparse rules, which makes the local repo accumulate unused files. # Use `git sync-main` to avoid this. Be careful if you have changes # on main branch, which is not a good practice. git config alias.sync-main '!git switch main && git fetch upstream && git reset --keep FETCH_HEAD'
-
Later, if you change the sparse checkout filter, run
git sparse-checkout reapply
.
Read more on Git's object model, partial clone, sparse checkout, sparse index, and negative refspecs.
Getting help
- Join the Discord server for online help and to ask questions while developing your extension. When doing so, please ask it in the
#programming
channel. - There are some features and tricks that are not explored in this document. Refer to existing extension code for examples.
Writing an extension
The quickest way to get started is to copy an existing extension's folder structure and renaming it as needed. We also recommend reading through a few existing extensions' code before you start.
Setting up a new Gradle module
Each extension should reside in src/<lang>/<mysourcename>
. Use all
as <lang>
if your target source supports multiple languages or if it could support multiple sources.
The <lang>
used in the folder inside src
should be the major language
part. For example, if you will be creating a pt-BR
source, use <lang>
here as pt
only. Inside the source class, use the full locale string instead.
Loading a subset of Gradle modules
By default, all individual extensions are loaded for local development. This may be inconvenient if you only need to work on one extension at a time.
To adjust which modules are loaded, make adjustments to the settings.gradle.kts
file as needed.
Extension file structure
The simplest extension structure looks like this:
$ tree src/<lang>/<mysourcename>/
src/<lang>/<mysourcename>/
├── AndroidManifest.xml
├── build.gradle
├── res
│ ├── mipmap-hdpi
│ │ └── ic_launcher.png
│ ├── mipmap-mdpi
│ │ └── ic_launcher.png
│ ├── mipmap-xhdpi
│ │ └── ic_launcher.png
│ ├── mipmap-xxhdpi
│ │ └── ic_launcher.png
│ ├── mipmap-xxxhdpi
│ │ └── ic_launcher.png
│ └── web_hi_res_512.png
└── src
└── eu
└── kanade
└── tachiyomi
└── extension
└── <lang>
└── <mysourcename>
└── <MySourceName>.kt
13 directories, 9 files
AndroidManifest.xml
A minimal Android manifest file is needed for Android to recognize an extension when it's compiled into an APK file. You can also add intent filters inside this file (see URL intent filter for more information).
build.gradle
Make sure that your new extension's build.gradle
file follows the following structure:
apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
ext {
extName = '<My source name>'
pkgNameSuffix = '<lang>.<mysourcename>'
extClass = '.<MySourceName>'
extVersionCode = 1
isNsfw = true
}
apply from: "$rootDir/common.gradle"
Field | Description |
---|---|
extName |
The name of the extension. |
pkgNameSuffix |
A unique suffix added to eu.kanade.tachiyomi.extension . The language and the site name should be enough. Remember your extension code implementation must be placed in this package. |
extClass |
Points to the class that implements Source . You can use a relative path starting with a dot (the package name is the base path). This is used to find and instantiate the source(s). |
extVersionCode |
The extension version code. This must be a positive integer and incremented with any change to the code. |
libVersion |
(Optional, defaults to 1.4 ) The version of the extensions library used. |
isNsfw |
(Optional, defaults to false ) Flag to indicate that a source contains NSFW content. |
The extension's version name is generated automatically by concatenating libVersion
and extVersionCode
. With the example used above, the version would be 1.4.1
.
Core dependencies
Extension API
Extensions rely on extensions-lib, which provides some interfaces and stubs from the app for compilation purposes. The actual implementations can be found here. Referencing the actual implementation will help with understanding extensions' call flow.
DataImage library
lib-dataimage
is a library for handling base 64 encoded image data using an OkHttp interceptor.
dependencies {
implementation(project(':lib-dataimage'))
}
i18n library
lib-i18n
is a library for handling internationalization in the sources. It allows loading .properties
files with messages located under the assets/i18n
folder of each extension, that can be used to translate strings under the source.
dependencies {
implementation(project(':lib-i18n'))
}
Additional dependencies
If you find yourself needing additional functionality, you can add more dependencies to your build.gradle
file.
Many of the dependencies from the main Tachiyomi app are exposed to extensions by default.
Note
Several dependencies are already exposed to all extensions via Gradle's version catalog. To view which are available check the
gradle/libs.versions.toml
file.
Notice that we're using compileOnly
instead of implementation
if the app already contains it. You could use implementation
instead for a new dependency, or you prefer not to rely on whatever the main app has at the expense of app size.
Important
Using
compileOnly
restricts you to versions that must be compatible with those used in the latest stable version of Tachiyomi.
Extension main class
The class which is referenced and defined by extClass
in build.gradle
. This class should implement either SourceFactory
or extend one of the Source
implementations: HttpSource
or ParsedHttpSource
.
Class | Description |
---|---|
SourceFactory |
Used to expose multiple Source s. Use this in case of a source that supports multiple languages or mirrors of the same website. |
HttpSource |
For online source, where requests are made using HTTP. |
ParsedHttpSource |
Similar to HttpSource , but has methods useful for scraping pages. |
Main class key variables
Field | Description |
---|---|
name |
Name displayed in the "Sources" tab in Tachiyomi. |
baseUrl |
Base URL of the source without any trailing slashes. |
lang |
An ISO 639-1 compliant language code (two letters in lower case in most cases, but can also include the country/dialect part by using a simple dash character). |
id |
Identifier of your source, automatically set in HttpSource . It should only be manually overriden if you need to copy an existing autogenerated ID. |
Extension call flow
Popular Manga
a.k.a. the Browse source entry point in the app (invoked by tapping on the source name).
- The app calls
fetchPopularManga
which should return aMangasPage
containing the first batch of foundSManga
entries.- This method supports pagination. When user scrolls the manga list and more results must be fetched, the app calls it again with increasing
page
values (starting withpage=1
). This continues whileMangasPage.hasNextPage
is passed astrue
andMangasPage.mangas
is not empty.
- This method supports pagination. When user scrolls the manga list and more results must be fetched, the app calls it again with increasing
- To show the list properly, the app needs
url
,title
andthumbnail_url
. You must set them here. The rest of the fields could be filled later (refer to Manga Details below).- You should set
thumbnail_url
if is available, if not,getMangaDetails
will be immediately called (this will increase network calls heavily and should be avoided).
- You should set
Latest Manga
a.k.a. the Latest source entry point in the app (invoked by tapping on the "Latest" button beside the source name).
- Enabled if
supportsLatest
istrue
for a source - Similar to popular manga, but should be fetching the latest entries from a source.
Manga Search
- When the user searches inside the app,
fetchSearchManga
will be called and the rest of the flow is similar to what happens withfetchPopularManga
.- If search functionality is not available, return
Observable.just(MangasPage(emptyList(), false))
- If search functionality is not available, return
getFilterList
will be called to get all filters and filter types.
Filters
The search flow have support to filters that can be added to a FilterList
inside the getFilterList
method. When the user changes the filters' state, they will be passed to the searchRequest
, and they can be iterated to create the request (by getting the filter.state
value, where the type varies depending on the Filter
used). You can check the filter types available here and in the table below.
Filter | State type | Description |
---|---|---|
Filter.Header |
None | A simple header. Useful for separating sections in the list or showing any note or warning to the user. |
Filter.Separator |
None | A line separator. Useful for visual distinction between sections. |
Filter.Select<V> |
Int |
A select control, similar to HTML's <select> . Only one item can be selected, and the state is the index of the selected one. |
Filter.Text |
String |
A text control, similar to HTML's <input type="text"> . |
Filter.CheckBox |
Boolean |
A checkbox control, similar to HTML's <input type="checkbox"> . The state is true if it's checked. |
Filter.TriState |
Int |
A enhanced checkbox control that supports an excluding state. The state can be compared with STATE_IGNORE , STATE_INCLUDE and STATE_EXCLUDE constants of the class. |
Filter.Group<V> |
List<V> |
A group of filters (preferentially of the same type). The state will be a List with all the states. |
Filter.Sort |
Selection |
A control for sorting, with support for the ordering. The state indicates which item index is selected and if the sorting is ascending . |
All control filters can have a default state set. It's usually recommended if the source have filters to make the initial state match the popular manga list, so when the user open the filter sheet, the state is equal and represents the current manga showing.
The Filter
classes can also be extended, so you can create new custom filters like the UriPartFilter
:
open class UriPartFilter(displayName: String, private val vals: Array<Pair<String, String>>) :
Filter.Select<String>(displayName, vals.map { it.first }.toTypedArray()) {
fun toUriPart() = vals[state].second
}
Manga Details
- When user taps on a manga,
getMangaDetails
andgetChapterList
will be called and the results will be cached.- A
SManga
entry is identified by it'surl
.
- A
getMangaDetails
is called to update a manga's details from when it was initialized earlier.SManga.initialized
tells the app if it should callgetMangaDetails
. If you are overridinggetMangaDetails
, make sure to pass it astrue
.SManga.genre
is a string containing list of all genres separated with", "
.SManga.status
is an "enum" value. Refer to the values in theSManga
companion object.- During a backup, only
url
andtitle
are stored. To restore the rest of the manga data, the app callsgetMangaDetails
, so all fields should be (re)filled in if possible. - If a
SManga
is cached,getMangaDetails
will be only called when the user does a manual update (Swipe-to-Refresh).
getChapterList
is called to display the chapter list.- The list should be sorted descending by the source order.
getMangaUrl
is called when the user taps "Open in WebView".- If the source uses an API to fetch the data, consider overriding this method to return the manga absolute URL in the website instead.
- It defaults to the URL provided to the request in
mangaDetailsRequest
.
Chapter
- After a chapter list for the manga is fetched and the app is going to cache the data,
prepareNewChapter
will be called. SChapter.date_upload
is the UNIX Epoch time expressed in milliseconds.-
If you don't pass
SChapter.date_upload
and leave it zero, the app will use the default date instead, but it's recommended to always fill it if it's available. -
To get the time in milliseconds from a date string, you can use a
SimpleDateFormat
like in the example below.private fun parseDate(dateStr: String): Long { return runCatching { DATE_FORMATTER.parse(dateStr)?.time } .getOrNull() ?: 0L } companion object { private val DATE_FORMATTER by lazy { SimpleDateFormat("yyyy-MM-dd HH:mm:ss", Locale.ENGLISH) } }
Make sure you make the
SimpleDateFormat
a class constant or variable so it doesn't get recreated for every chapter. If you need to parse or format dates in manga description, create another instance sinceSimpleDateFormat
is not thread-safe. -
If the parsing have any problem, make sure to return
0L
so the app will use the default date instead. -
The app will overwrite dates of existing old chapters UNLESS
0L
is returned. -
The default date has changed in preview ≥ r4442 or stable > 0.13.4.
- In older versions, the default date is always the fetch date.
- In newer versions, this is the same if every (new) chapter has
0L
returned. - However, if the source only provides the upload date of the latest chapter, you can now set it to the latest chapter and leave other chapters default. The app will automatically set it (instead of fetch date) to every new chapter and leave old chapters' dates untouched.
-
getChapterUrl
is called when the user taps "Open in WebView" in the reader.- If the source uses an API to fetch the data, consider overriding this method to return the chapter absolute URL in the website instead.
- It defaults to the URL provided to the request in
pageListRequest
.
Chapter Pages
- When user opens a chapter,
getPageList
will be called and it will return a list ofPage
s. - While a chapter is open in the reader or is being downloaded,
fetchImageUrl
will be called to get URLs for each page of the manga if thePage.imageUrl
is empty. - If the source provides all the
Page.imageUrl
's directly, you can fill them and let thePage.url
empty, so the app will skip thefetchImageUrl
source and call directlyfetchImage
. - The
Page.url
andPage.imageUrl
attributes should be set as an absolute URL. - Chapter pages numbers start from
0
. - The list of
Page
s should be returned already sorted, theindex
field is ignored.
Misc notes
- Sometimes you may find no use for some inherited methods. If so just override them and throw exceptions:
throw UnsupportedOperationException("Not used.")
- You probably will find
getUrlWithoutDomain
useful when parsing the target source URLs. Keep in mind there's a current issue with spaces in the URL though, so if you use it, replace all spaces with URL encoded characters (like%20
). - If possible try to stick to the general workflow from
HttpSource
/ParsedHttpSource
; breaking them may cause you more headache than necessary. - By implementing
ConfigurableSource
you can add settings to your source, which is backed bySharedPreferences
.
Advanced Extension features
URL intent filter
Extensions can define URL intent filters by defining it inside a custom AndroidManifest.xml
file.
(Example TBD.)
To test if the URL intent filter is working as expected, you can try opening the website in a browser and navigating to the endpoint that was added as a filter or clicking a hyperlink. Alternatively, you can use the adb
command below.
$ adb shell am start -d "<your-link>" -a android.intent.action.VIEW
Caution
The activity does not support any Kotlin Intrinsics specific methods or calls, and using them will causes crashes in the activity. Consider using Java's equivalent methods instead, such as using
String
'sequals()
instead of using==
.You can use Kotlin Intrinsics in the extension source class, this limitation only applies to the activity classes.
Update strategy
There is some cases where titles in a source will always only have the same chapter list (i.e. immutable), and don't need to be included in a global update of the app because of that, saving a lot of requests and preventing causing unnecessary damage to the source servers. To change the update strategy of a SManga
, use the update_strategy
field. You can find below a description of the current possible values.
UpdateStrategy.ALWAYS_UPDATE
: Titles marked as always update will be included in the library update if they aren't excluded by additional restrictions.UpdateStrategy.ONLY_FETCH_ONCE
: Titles marked as only fetch once will be automatically skipped during library updates. Useful for cases where the series is previously known to be finished and have only a single chapter, for example.
If not set, it defaults to ALWAYS_UPDATE
.
Renaming existing sources
There is some cases where existing sources changes their name on the website. To correctly reflect these changes in the extension, you need to explicity set the id
to the same old value, otherwise it will get changed by the new name
value and users will be forced to migrate back to the source.
To get the current id
value before the name change, you can search the source name in the repository JSON file by looking into the sources
attribute of the extension. When you have the id
copied, you can override it in the source:
override val id: Long = <the-id>
Then the class name and the name
attribute value can be changed. Also don't forget to update the extension name and class name in the individual Gradle file.
Important
The package name needs to be the same (even if it has the old name), otherwise users will not receive the extension update when it gets published in the repository.
The id
also needs to be explicity set to the old value if you're changing the lang
attribute.
Note
If the source has also changed their theme you can instead just change the
name
field in the source class and in the Gradle file. By doing so a newid
will be generated and users will be forced to migrate.
Running
To make local development more convenient, you can use the following run configuration to launch Tachiyomi directly at the Browse panel:
If you're running a Preview or debug build of Tachiyomi:
-W -S -n eu.kanade.tachiyomi.debug/eu.kanade.tachiyomi.ui.main.MainActivity -a eu.kanade.tachiyomi.SHOW_CATALOGUES
And for a release build of Tachiyomi:
-W -S -n eu.kanade.tachiyomi/eu.kanade.tachiyomi.ui.main.MainActivity -a eu.kanade.tachiyomi.SHOW_CATALOGUES
Important
If you're deploying to Android 11 or higher, enable the "Always install with package manager" option in the run configurations. Without this option enabled, you might face issues such as Android Studio running an older version of the extension without the modifications you might have done.
Debugging
Android Debugger
You can leverage the Android Debugger to step through your extension while debugging.
You cannot simply use Android Studio's Debug 'module.name'
-> this will most likely result in an error while launching.
Instead, once you've built and installed your extension on the target device, use Attach Debugger to Android Process
to start debugging Tachiyomi.
Logs
You can also elect to simply rely on logs printed from your extension, which
show up in the Logcat
panel of Android Studio.
Inspecting network calls
One of the easiest way to inspect network issues (such as HTTP errors 404, 429, no chapter found etc.) is to use the Logcat
panel of Android Studio and filtering by the OkHttpClient
tag.
To be able to check the calls done by OkHttp, you need to enable verbose logging in the app, that is not enabled by default and is only included in the Preview versions of Tachiyomi. To enable it, go to More -> Settings -> Advanced -> Verbose logging. After enabling it, don't forget to restart the app.
Inspecting the Logcat allows you to get a good look at the call flow and it's more than enough in most cases where issues occurs. However, alternatively, you can also use an external tool like mitm-proxy
. For that, refer to the subsequent sections.
On newer Android Studio versions, you can use its built-in Network Inspector inside the App Inspection tool window. This feature provides a nice GUI to inspect the requests made in the app.
To use it, follow the official documentation and select Tachiyomi package name in the process list.
Using external network inspecting tools
If you want to take a deeper look into the network flow, such as taking a look into the request and response bodies, you can use an external tool like mitm-proxy
.
Setup your proxy server
We are going to use mitm-proxy but you can replace it with any other Web Debugger (i.e. Charles, Burp Suite, Fiddler etc). To install and execute, follow the commands bellow.
Install the tool.
$ sudo pip3 install mitmproxy
Execute the web interface and the proxy.
$ mitmweb
Alternatively, you can also use the Docker image:
$ docker run --rm -it -p 8080:8080 \
-p 127.0.0.1:8081:8081 \
--web-host 0.0.0.0 \
mitmproxy/mitmproxy mitmweb
After installing and running, open your browser and navigate to http://127.0.0.1:8081.
OkHttp proxy setup
Since most of the manga sources are going to use HTTPS, we need to disable SSL verification in order to use the web debugger. For that, add this code to inside your source class:
package eu.kanade.tachiyomi.extension.en.mysource
import android.annotation.SuppressLint
import eu.kanade.tachiyomi.source.online.HttpSource
import okhttp3.OkHttpClient
import java.net.InetSocketAddress
import java.net.Proxy
import java.security.SecureRandom
import java.security.cert.X509Certificate
import javax.net.ssl.SSLContext
import javax.net.ssl.TrustManager
import javax.net.ssl.X509TrustManager
class MySource : HttpSource() {
private fun OkHttpClient.Builder.ignoreAllSSLErrors(): OkHttpClient.Builder {
val naiveTrustManager = @SuppressLint("CustomX509TrustManager")
object : X509TrustManager {
override fun getAcceptedIssuers(): Array<X509Certificate> = emptyArray()
override fun checkClientTrusted(certs: Array<X509Certificate>, authType: String) = Unit
override fun checkServerTrusted(certs: Array<X509Certificate>, authType: String) = Unit
}
val insecureSocketFactory = SSLContext.getInstance("TLSv1.2").apply {
val trustAllCerts = arrayOf<TrustManager>(naiveTrustManager)
init(null, trustAllCerts, SecureRandom())
}.socketFactory
sslSocketFactory(insecureSocketFactory, naiveTrustManager)
hostnameVerifier { _, _ -> true }
return this
}
override val client: OkHttpClient = network.cloudflareClient.newBuilder()
.ignoreAllSSLErrors()
.proxy(Proxy(Proxy.Type.HTTP, InetSocketAddress("10.0.2.2", 8080)))
.build()
}
Note: 10.0.2.2
is usually the address of your loopback interface in the android emulator. If Tachiyomi tells you that it's unable to connect to 10.0.2.2:8080 you will likely need to change it (the same if you are using hardware device).
If all went well, you should see all requests and responses made by the source in the web interface of mitmweb
.
Building
APKs can be created in Android Studio via Build > Build Bundle(s) / APK(s) > Build APK(s)
or Build > Generate Signed Bundle / APK
.
Submitting the changes
When you feel confident about your changes, submit a new Pull Request so your code can be reviewed and merged if it's approved. We encourage following a GitHub Standard Fork & Pull Request Workflow and following the good practices of the workflow, such as not commiting directly to main
: always create a new branch for your changes.
If you are more comfortable about using Git GUI-based tools, you can refer to this guide about the Git integration inside Android Studio, specifically the "How to Contribute to an to Existing Git Repository in Android Studio" section of the guide.
Important
Make sure you have generated the extension icon using the linked Icon Generator tool in the Tools section. The icon must follow the pattern adopted by all other extensions: a square with rounded corners.
Please do test your changes by compiling it through Android Studio before submitting it. Obvious untested PRs will not be merged, such as ones created with the GitHub web interface. Also make sure to follow the PR checklist available in the PR body field when creating a new PR. As a reference, you can find it below.
Pull Request checklist
- Update
extVersionCode
value inbuild.gradle
for individual extensions - Reference all related issues in the PR body (e.g. "Closes #xyz")
- Add the
isNsfw = true
flag inbuild.gradle
when appropriate - Explicitly kept the
id
if a source's name or language were changed - Test the modifications by compiling and running the extension through Android Studio