Creating faux square Android Navigation Drawer icons

The Navigation drawer widget in Android can display vector SVG icons, but if the vector icons are non-rectangular, Android will distort the dimensions to force them into squares. This can be seen in the screenshot of the Hawaii flag icon below.


It is possible to extend the drawer by code to display non-rectangular icons but I prefer to adjust the SVG icon instead. The way I did it was to change the page size to a square and then placing a transparent square box around the page. The following steps illustrate:

Change the page to a square

1. Open up the SVG icon in Inkscape.
   
   
   
2. Select File | Document Properties.
   
   
   
1. Under the Page tab, change the Width and Height to be equal e.g. 1200 x 1200 px. Close the dialog box.
   
   The page display changes to a square.
   
   
3. Using the Align and Distribute tools, align the graphics to the middle of the page.
   
   
   
   

Create a transparent square

1.  Next, click the Create rectangles and squares (F4) icon. Place a stroke only, no-fill rectangle on the page.
   
   
   
2. Change the width and height of the rectangle to match the page dimensions e.g. 1200 by 1200 px.
   
   
   
3. Change the origin to the upper left corner of the page, e.g. X=0, Y=0.
   
   
4. Open the Fill and stroke pane. Change the stroke opacity to low or zero opacity, e.g. 0.
   
   
   
5. Save the file.
   

Import the SVG vector icon into an Android drawable icon

1.  In Android Studio, right click on the /path/to/app/res/drawables folder and choose New | Vector Asset.
   
   
   
2. Toggle on Local File (PNG, SVG). Choose the new SVG icon file from the previous section.
   
3. Click Next. Click OK.
   
   The drawable is created.

Using this new icon, the Navigation drawer can now display the icon seemingly with the correct proportions, as shown below.

Set Android system bar to be transparent when Navigation drawer is opened

While developing Android apps, a lot of times I broke the code and made the Android system bar opaque when the Navigation drawer is opened, as shown in the screenshot below.

Then I had to waste precious time hunting down the cause. So I am putting down the requirements to enable the Android system bar to be transparent over the Navigation drawer.

1. In Android Studio, open up the XML layout file e.g. activity_main.xml for the activity with the Navigation Drawer. In the AndroidX DrawerLayout widget, make sure the property fitsSystemWindows is set to true.
   
   
   
   
2. Next, create a "no action bar" style e.g. AppThem.NoActionBar in styles.xml to be used by the activity with the Navigation Drawer. In the example below, the style inherits the theme Theme.AppCompat.DayNight.DarkActionBar style for day and night mode styling.
   
   
   
3. Set the properties windowActionBar to false and windowNoTitle to true.
   
4. Then create the same "no action bar" style for Android API 21 and above e.g. /path/to/res/values-v21/styles.xml. Set the properties windowDrawsSystemBarBackgrounds to true and statusBarColor to "@android:color/transparent" as shown below.
   
   
   
5. Compile and run the application. The system bar should be transparent over the Navigation Drawer now.
   
   

Resolving Android Studio "Cannot fit requested classes in a single dex file" error

After I added an additional library to an Android app, this error "null, Cannot fit requested classes in a single dex file (# methods: 66445 > 65536)" occurred while trying to build the application in Android Studio, as shown in the screenshot below.
 
The solution to this is to enable multi dex support in the Android app. The following steps show how to do this:

1. In Android Studio, add in a new dependency to the androidx.multidex:multidex library to the app's build.gradle file.
   
   dependencies {
   ...etc...
   implementation 'androidx.multidex:multidex:2.0.1
   ...etc...
   }
   
2. Then in the same app build.gradle file, toggle true the multiDexEnabled property.
   
   android {
     defaultConfig {
       ...etc...
       multiDexEnabled true
       ...etc...
     }
   }

Now, compiling the Android application should no longer result in the dex error.

Convert a Velodyne PCAP file into a ROS bag file

Normally Velodyne laser sensors record LiDAR data packets in PCAP format (*.pcap) file. If later on you want to process this recorded PCAP file in some SLAM algorithm in ROS e.g. ROS Cartogropher, then it may be necessary to convert it into a ROS bag file.

To convert the PCAP file e.g. HDL32-V2_Monterey_Highway.pcap, perform the following:

1.  Open up a Terminal. Enter the command to record the messages under the ROS topic /velodyne_points to an output bag file.
   
   $ rosbag record -O /path/to/output.bag /velodyne_points
   Note: /velodyne_points is the message to record. Leave blank if you want to record all messages.
   
2. Open up another Terminal. Change directory to the location of the PCAP file, e.g. /path/to/Downloads/.
   
   $ cd /path/to/Downloads
3. Enter the command to playback the Velodyne PCAP file and publish as a point cloud.
   
   $ roslaunch velodyne_pointcloud 32e_points.launch pcap:=$(pwd)/HDL32-V2_Monterey_Highway.pcap readonce:=true
   
   
   Note: this command publishes a HDL-32E PCAP file as a point cloud.
4. Wait until the PCAP file is fully read. You can use the following command in another Terminal to check if anymore data is published.
   
   $ rostopic echo /velodyne_points
   
   A stream of points appear.
   
5. When no more messages appear, the PCAP file is fully read. In the first Terminal, press CTRL-C to interrupt and complete the recording process to the bag file.
   
   The bag file is created.