DEV Community

Cover image for Make Your Own Custom Android Launcher using Flutter
5hfT
5hfT

Posted on • Updated on

Make Your Own Custom Android Launcher using Flutter

Ubuntu Launcher

Have you ever thought of making your own stuffs and use them?

Like your Own

  • Operation System !
  • Programming Language !
  • Library !
  • Framework !
  • Apps !
  • Games !

I'm that kind of person who was always interested in making applications which are integrated to the system (literally Applications) not business or commercial applications and still i am :3

I have always dreamt about things of my own...

So once I thought to make my own Android Launcher as I'm using Android Phones.

At first I thought it's something very hard and I won't be able to make a launcher.Then I found it supper easy!

Today i am going to discuss about how to nake your Android Launcher !

Let's start!

I am using Flutter which is a Cross Platform Framework of Dart Made by Google.

There is a big community of Flutter to make cross platform applications such as Android,IOS,Desktop and Web applications.

If you haven't installed flutter yet then have a look at their doc which is very user friendly and well decorated.

Install Flutter

Note : I am using Visual Studio Code as a Editor or IDE and prefer terminal and command line activities.

Lets create a flutter application

  • Command in terminal :

flutter create -i objc -a java custom_launcher

Note : This command will create a application named custom_launcher and the native code for Android will be java

If you prefer Kotlin then just use -

flutter create custom_launcher

A flutter app will be created with similler file Structure:

files

We will code in main.dart file.

First We will need to edit some codes in the AndroidManifest.xml file. That will make our launcher different from normal Android Applications

Manifest file location :

xml

  • Add these lines in AndroidManifest.xml file under <intent-filter> section :
<category android:name="android.intent.category.HOME" />
<category android:name="android.intent.category.DEFAULT" />

Enter fullscreen mode Exit fullscreen mode

Now If you run your app , it will appear as a Launcher.

Or Press Home button of your android phone and it will ask to set it as default launcher.

  • launcher
Congrats You have made your launcher :D

Yup Seriously ! It is that easy !

Now as a Flutter Application developer I hope you are able to do some of your own customizations.

I know you are concert about how can you show the installed applications in your custom Launcher.

Let's do it:

Interact with the Applications installed in Phone

To do so we will use a flutter plugin named device_apps which will give us a List<application> where all the necessary informations will be given.

  • First import device_apps into your dart file :
import 'package:device_apps/device_apps.dart';
Enter fullscreen mode Exit fullscreen mode
  • Get the list of apps available in your phone :

List<Application> apps = await DeviceApps.getInstalledApplications();

Enter fullscreen mode Exit fullscreen mode
  • You can send some parameters too :

List<Application> apps = await DeviceApps.getInstalledApplications
(
    includeAppIcons: true,
    includeSystemApps: true,
    onlyAppsWithLaunchIntent: true,
)

Enter fullscreen mode Exit fullscreen mode

This will return something like that :

20data

It provides :
App Name (String)
Apk File Path (String)
Package Name (String)
Version Name (String)
Version Code (int)
System App ? (bool)
Install Time (int)
Update Time (int)
Application Catagory (Catagory Type)
Enter fullscreen mode Exit fullscreen mode

It also provides icon as ApplicationIcon.
To access icon you have to use that Application type as ApplicationWithIcon and check that the app has a icon first.

Note : icon is a Uint8 List type.

Now You have your data so do what ever you want !

Let me show you how you can use them

  • Let's traverse all the apps we get before :

for (int i=0;i<apps.length;i++){
    Application app = apps[i];
}

Enter fullscreen mode Exit fullscreen mode
  • Extract the application name :

Text(app.appName)

Enter fullscreen mode Exit fullscreen mode
  • Use Icon :

app is ApplicationWithIcon ? CircleAvatar(
 backgroundImage:
     MemoryImage(
   app.icon,
 ),
)

Enter fullscreen mode Exit fullscreen mode

Note : If you are not able to access app.icon then use this -


ApplicationWithIcon icon app as ApplicationWithIcon;
icon = icon.icon;
Enter fullscreen mode Exit fullscreen mode

More things you will want to do :

  • Check if an application is installed :

bool isInstalled = await DeviceApps.isAppInstalled('packageName');

Enter fullscreen mode Exit fullscreen mode
  • Open an Application :

DeviceApps.openApp('packageName');

Enter fullscreen mode Exit fullscreen mode
Apps can be shown like this :

I have made an Android Launcher which is lightweight and Fast.You can have a look and If you like then give me a star :v

Source Code available : Ubuntu Launcher

Apk Release : Install

Happy Coding :D

Contact with | Follow me on : LinkedIn Twitter Facebook GitHub Quora Dev Medium

Top comments (10)

Collapse
 
zanuura profile image
Hammam Hanan

how to make a search engine to search for the application with that packages?

Collapse
 
mh_shifat profile image
5hfT

checkout the source code where i have implemented the search apps feature
github.com/jspw/Ubuntu-Launcher/bl...

Collapse
 
theonlybeardedbeast profile image
TheOnlyBeardedBeast

Nice work, my plan is to rebuild the windows 10 phone UI

Collapse
 
mh_shifat profile image
5hfT

great

Collapse
 
hlee131 profile image
H Lee

Is this possible with Javascript using React Native?

Collapse
 
mh_shifat profile image
5hfT

I hope it's possible .
What extra you will need to do some native code to get the information about the apps installed in your mobile phone.
I don't know if there is any package available to show the app list in your mobile.

Collapse
 
mh_shifat profile image
5hfT

Check latest version here Ubuntu Launcher 2.1.0

Collapse
 
mh_shifat profile image
5hfT

here is the latest release apk Ubuntu Launcher 2.0.1

Collapse
 
laxmikantswam16 profile image
Laxmikant Swami

Can we add widgets in this

Collapse
 
mh_shifat profile image
5hfT

I think you can, but have to google about it.