table app

Multiplication Table App Tutorial in Android

In this article, we will learn how to create a multiplication table app using seek bar in kotlin language.

This is a very basic Android app that allows you to print a multiplication table. There are no boundaries. You can print a multiplication table of any number.

Steps for creating an app:

  • Step 1 –> Open the activity main.xml file and insert a TextView, listview, and a seekbar.
  • Step 2–> Assign a unique identifier(id) to each component.
  • Step 3–> Open the MainActivity file and define the variables.
  • Step 4–> Implement a seekbar method.
  • Step 5–> Implement an adapter for listview
  • Step 6–> Run your program.

Preview: Multiplication Table Application

<– Table Application Example

Learn Java Programming & get a Certificate

Click to download

File:MainActivity.kt

–>In MainActivity.kt file initializes variable and implements seekbar methods.

package com.example.table20

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title="TABLE"



        findViewById<TextView>(R.id.text)
        findViewById<ListView>(R.id.listView)
        val seek = findViewById<SeekBar>(R.id.seekBar)

        seek.max = 100
        seek?.setOnSeekBarChangeListener(object : SeekBar.OnSeekBarChangeListener {
            override fun onProgressChanged(seekBar: SeekBar, progress: Int, fromUser: Boolean) {
//                Toast.makeText(
//                    this@MainActivity,
//                    "Populating Table of  $progress ",
//                    Toast.LENGTH_SHORT
//                ).show()
                populate(progress)
            }

            override fun onStartTrackingTouch(seekBar: SeekBar) {

            }

            override fun onStopTrackingTouch(seekBar: SeekBar) {
//                Toast.makeText(
//                    this@MainActivity,
//                    "The  final progress is  " + seek.progress,
//                    Toast.LENGTH_LONG
//                ).show()

            }

        })

    }

        fun populate(progress: Int) {

            val arrayList = ArrayList<String>()

            for (i in 1..10)
            {
                val product = progress * i
                arrayList.add("                  $progress            *          $i         =           $product")
//


            }
            val arrayAdapter = ArrayAdapter(
                this,
                android.R.layout.simple_list_item_1, arrayList
            )
            findViewById<ListView>(R.id.listView).adapter=arrayAdapter
            findViewById<TextView>(R.id.text).text = "Multiplication Table of  "  +   progress



    }
}

File: activity_main.xml

–> activity_main.xml file contains seekbar and listview,textview .

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#616161"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text=" -- MULTIPLICATION TABLE --"
        android:textColor="@color/black"
        android:textSize="24sp"
        android:textStyle="bold"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ListView
        android:id="@+id/listView"
        android:layout_width="409dp"
        android:layout_height="559dp"
        android:layout_margin="10dp"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="30dp"
        android:layout_marginEnd="10dp"
        android:layout_marginRight="10dp"
        android:background="@color/black"
        app:layout_constraintBottom_toTopOf="@+id/seekBar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/text"
        app:layout_constraintVertical_bias="0.515" />

    <SeekBar
        android:id="@+id/seekBar"
        style="@style/Animation.Design.BottomSheetDialog"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginEnd="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="40dp"
        android:outlineAmbientShadowColor="@color/black"
        android:soundEffectsEnabled="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

Conclusion
You’ve just finished your Multiplication Table App that’s totally working! I recommend that you make a few changes. You could experiment with the seekbar positions and style or listview.

  • We hope that this guide will assist you in quickly creating a simple Multiplication Table Application. If you have any problems, please post them in the comments section and we will gladly assist you.

Creating a Flashlight Android Application

Complete Happy Birthday App in Android

This Post Has 3 Comments

Leave a Reply