Lune | API Documentation

Android SDK

An SDK to embed Lune enrichment views into your Android mobile apps.
‍

Lune Android SDK is a Kotlin library, distributed as a AAR file.
To get started follow the below guide.

Get Started

Integration

Download and install SDK .aar file with all dependencies into your android project.

1. Install SDK AAR File

1.1 Download SDK AAR File

1.2 Install AAR file into your android project

Switch project view to Project
Locate libs folder to add external Android libraries to your app

1.3 Copy SDK AAR file into libs folder

Now we can import the library as a project dependency.

2. Install SDK Dependencies

Add the following dependencies into app-level build.gradle

dependencies {
  //LuneSdk
  implementation files("libs/LuneSDK-debug.aar")

  //flowlayout
  implementation "com.google.accompanist:accompanist-flowlayout:0.20.0"

  //pie-chart
  implementation "ir.mahozad.android:pie-chart:0.7.0"

  //coil
  implementation "io.coil-kt:coil-compose:2.0.0"
}

3. Initialization

To initialize the SDK, you simply have to create an instance of LuneKitManager that would be used across your app. The constructor accepts optional arguments for global customization of the views in the SDK.

val luneKitManager = LuneKitManager(
        primaryColor = Color(0xFF2274A5), //optional
        borderRadius = 5.dp, //optional
        enFontFamily = helveticaFont, //optional
        arFontFamily = cairoFont, //optional
        locale = "en" //optional
    )

LuneKitManager Class Configurations

Parameter

Type

primaryColor

Color

borderRadius

Dp

enFontFamily

FontFamily

arFontFamily

FontFamily

locale

String

With the instance in hand, luneKitManager, in this example, you can embed any of the Lune views into your app by calling the method(s) responsible for such views.

We'd look at each view in detail now.

Budget Form

The BudgetForm allows the user to set up a new budget. To use this view, just call the BudgetForm method of your LuneKitManager instance as shown in the example below.


Surface(modifier = Modifier.fillMaxSize()) {
                    luneKitManager.BudgetForm(){ amount ->
                        Log.d("amountConfirmed", "onCreate: $amount")
                    }
                }

BudgetForm parameters

Parameter

Type

Description

primaryColor

Color

Component primary color

contentColor

Color

Component content color

fontFamily

FontFamily

Component text font family

callback

(budget: String) → Unit

A callback is called when confirm button is clicked

Budget Summary

The BudgetSummaryView shows the user's overall spend in contrast to his budget and his expected spend per time. To use this view, just call the BudgetSummaryView method of your LuneKitManager instance as shown in the example below. The method takes a BudgetSummary object.

val budgetSummaryData = BudgetSummary(
                budgetedAmount = 10000.0,
                spentAmount = 5000.0,
                expectedSpendValue = 5000.00,
                expectedSpendPercent = 0.5
            )

Surface {
	luneKitManager.BudgetSummaryView(data = budgetSummaryData)
}

BudgetSummaryView parameters

Parameter

Type

Description

data

BudgetSummary?

Data to be passed to the component

primaryColor

Color

Component primary color

borderRadius

Dp

Component card border radius

fontFamily

FontFamily

Component text font family

Category Spend List View

The CategorySpendListView shows the user's spend per each category, the user can modify specified budged for each category. To use this view, just call the CategorySpendListView method of your LuneKitManager instance as shown in the example below.

val categories = ArrayList<CategoryBudgetSpend>()

            categories.add(
                CategoryBudgetSpend(
                    categoryId = "1",
                    categoryDesc = "Financial Services",
                    transactionsCounts = 23,
                    spentAmount = 500.0,
                    budgetedAmount = 1000.0,
                ),
            )

            categories.add(
                CategoryBudgetSpend(
                    categoryId = "2",
                    categoryDesc = "Charity and Gifts",
                    transactionsCounts = 1,
                    spentAmount = 220.0,
                    budgetedAmount = 1000.0,
                )
            )

            categories.add(
                CategoryBudgetSpend(
                    categoryId = "3",
                    categoryDesc = "Education",
                    transactionsCounts = 2,
                    spentAmount = 350.0,
                    budgetedAmount = 1000.0,
                )
            )

            categories.add(
                CategoryBudgetSpend(
                    categoryId = "4",
                    categoryDesc = "Entertainment",
                    transactionsCounts = 6,
                    spentAmount = 453.0,
                    budgetedAmount = 1000.0,
                )
            )



            LazyColumn {
                item {
                    luneKitManager.CategorySpendListView(
                        data = categories,
                        editCategories = true,
                        totalBudget = 10000.0
                    ) { modifiedCategories ->
                        Log.d("TAG", "onCreate: $modifiedCategories")

                    }
                }
            }

CategorySpendListView parameters

Parameter

Type

Description

data

List<CategoryBudgetSpend>?

Data to be passed to the component

primaryColor

Color

Component primary color

contentColor

Color

Component text color

borderRadius

Dp

List item border radius

fontFamily

FontFamily

Component text font family

editCategories

Boolean

To edit categories budget

totalBudget

Double

The total specified budget, this is used to edit categories budget and to not exceed this range.

onChange

(List<CategoryBudgetSpend>) -> Unit

A callback that returns list of all edited categories (The callback fires whenever a category is being modified)

Categories Spend PieChart

The CategoriesPieChart shows the user's spend per top 5 categories with the total amount spend. To use this view, just call the CategoriesPieChart method of your LuneKitManager instance as shown in the example below.

val categoriesSpendList = ArrayList<SpendCategory>()

            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "1",
                    categoryDesc = "Finance Service",
                    amount = 4244.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "2",
                    categoryDesc = "Education",
                    amount = 1454.3,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "3",
                    categoryDesc = "Transportatioin",
                    amount = 1533.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "4",
                    categoryDesc = "Test",
                    amount = 1244.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "5",
                    categoryDesc = "Shopping",
                    amount = 1222.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "6",
                    categoryDesc = "Shopping",
                    amount = 1222.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "7",
                    categoryDesc = "Shopping",
                    amount = 1222.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "8",
                    categoryDesc = "Shopping",
                    amount = 2222.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "9",
                    categoryDesc = "Shopping",
                    amount = 6222.4,
                    currencyCode = "AED"
                )
            )
            categoriesSpendList.add(
                SpendCategory(
                    categoryId = "10",
                    categoryDesc = "Shopping",
                    amount = 7222.4,
                    currencyCode = "AED"
                )
            )


Surface{
		luneKitManager.CategoriesPieChart(data = categoriesSpendList)
}

CategoriesPieChart parameters

Parameter

Type

Description

data

List<SpendCategory>?

Data to be passed to the component as a list and then the chart will show top 5 spend categories

primaryColor

Color

Component primary color

borderRadius

Dp

Component card border radius

fontFamily

FontFamily

Component text font family

Brand List View

The BrandListView shows a list of brands the user has patronized. To use this view, just call the BrandListView method of your LuneKitManager instance as shown in the example below.

val spendPerBrandList = ArrayList<BrandSpend>()

            spendPerBrandList.add(
                BrandSpend(
                    brandId = "1",
                    brandName = "Uber Eats",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/UberEats.webp",
                    amount = 777.7
                )
            )
            spendPerBrandList.add(
                BrandSpend(
                    brandId = "2",
                    brandName = "AlBaik",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/AlBaik.jpg",
                    amount = 23.4
                )
            )
            spendPerBrandList.add(
                BrandSpend(
                    brandId = "3",
                    brandName = "Filli Cafe",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/download_89_1.png",
                    amount = 125.7
                )
            )
            spendPerBrandList.add(
                BrandSpend(
                    brandId = "4",
                    brandName = "Hoichoi",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/Hoichoi.jpg",
                    amount = 233.7
                )
            )
            spendPerBrandList.add(
                BrandSpend(
                    brandId = "5",
                    brandName = "Circle K",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/Circle_K.jfif",
                    amount = 456.7
                )
            )
            spendPerBrandList.add(
                BrandSpend(
                    brandId = "6",
                    brandName = "Sephora",
                    brandLogoUrl = "https://api.lunedata.io/media/brand_logos/Sephora.jpg",
                    amount = 754.7
                )
            )


LazyColumn{
    item{
        luneKitManager.BrandListView(data = spendPerBrandList)
    }
}

BrandListView parameters

Parameter

Type

Description

data

List<BrandSpend>?

Data to be passed to the component

contentColor

Color

Component text color

borderRadius

Dp

List cards border radius

fontFamily

FontFamily

Component text font family

Transaction List View

The TransactionListView shows a list of enriched transactions in a user-friendly way, which each transaction having an associated brand. To use this view, just call the TransactionListView method of your LuneKitManager instance as shown in the example below.

val transactionsPerCat = ArrayList<Transaction>()
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "NBF DIFC ATM",
                    amount = 1550.33,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/nbf.png",
                    brandName = "NBF"
                )
            )
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "HILAL BNK AD MMCD",
                    amount = 5250.33,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/1653025313914.jpeg",
                    brandName = "Al Hilal Bank"
                )
            )
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "SUNNSAND FUJ Purch",
                    amount = 3421.00,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/SunSand.jpg",
                    brandName = "Sun & Sand"
                )
            )
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "AIRBNB DXB",
                    amount = 3421.00,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/Airbnb.jpeg",
                    brandName = "Airbnb"
                )
            )
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "DAR MONTBLANC",
                    amount = 3421.00,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/Montblanc.jpg",
                    brandName = "Montblanc"
                )
            )
            transactionsPerCat.add(
                Transaction(
                    rawDescription = "EMR AIRLINES 23TD",
                    amount = 3421.00,
                    brandLogo = "https://api.lunedata.io/media/brand_logos/Emirates_Airlines.jpg",
                    brandName = "Emirates Airlines"
                )
            )


LazyColumn{
    item{
        luneKitManager.TransactionListView(data = transactionsPerCat)
    }
}

TransactionListView parameters

Parameter

Type

Description

data

List<Transaction>?

Data to be passed to the component

contentColor

Color

Component text color

borderRadius

Dp

List cards border radius

fontFamily

FontFamily

Component text font family

Localization

The Android SDK provides two Locales en and ar . To switch between Locales just configure the LuneKitManager locale parameter. This will change all components Locale and it will also handle LTR & RTL views.

val luneKitManager = LuneKitManager(
        locale = "ar" // deafult is "en"
    )