React Native switches local files in Android bundle - android

I am facing an issue with local images in a React Native app. I have a file where I require all of my app icons, something like this:
export const icons = {
a: require("a.png"),
b: require("b.png"),
c: require("c.png")
};
Then I use these files in the React Native Image component. For instance:
import { icons } from "icons";
<Image
source={icons.a}
/>
It works fine in dev mode on both iOS and Android. It also works fine on iOS archive in production. But in Android production bundle, the icons seem to be randomly switched up. Sometimes icon a is displayed instead of icon b, sometimes it is icon c that is displayed instead of icon a, and so on... Sometimes one of the icon is not even displayed at all.
Can the problem come from requiring all the files in the same file ?
I would appreciate any clue. Thanks a lot.

Related

Android Auto: Custom action's icon not showing

I'm trying to add a custom action to the media session's playback state, so it can show an addition button on Android Auto. The code is indeed simple, the button is added and I can receive its callback, but the problem is the button doesn't have an icon:
The code:
val builder = PlaybackStateCompat.Builder()
builder.addCustomAction(
"ACTION_TEST",
"TEST LABEL",
R.drawable.ic_test // I tried vector drawable, png,... nothing works
)
// ...
mediaSession.setPlaybackState(builder.build())
The result: the added button doesn't have an icon, only shows a ripple effect (the circle in the screenshot) when I click it, otherwise it's invisible.
I found out the root cause. It's because Android Studio auto-optimizes the build process to produce minimal APK that can run on current ADB-connected devices.
In my case, AS included only xhdpi resources in the debug APK, therefore Android Audio HeadUnit couldn't load the drawable. Basically, AS silently changed the Gradle config to somewhat like this:
android {
...
productFlavors {
dev {
resConfigs "xhdpi" // <- root cause
}
...
}
}
I can simply run my app from the terminal to get rid of this problem.
If you have the same problem, just ensure the drawable is available for all screen densities (hdpi, xhdpi,...), and check your APK whether it's packaged with resources in all screen densities.
For me, the problem was resolved when I cleared the data of Android App application on my phone.
Was using it to run DHU emulator on desktop. Somehow its caching went awry.

Why is the MDToolvar icon not showing on Android?(Kivy)

I am building a kivy based Android app. At the moment when I run the app on Linux the MDToolbar shows the menu icon without a problem. But when I build the app for Android with menu icon dosent show up. The lambda function works even if the icon is not presented.
Here is an image that shows the problem.
This is the kv code.
MDToolbar:
id: mainToolbar
title: "APP name"
left_action_items: [['menu', lambda x: navDrawer.set_state("open")]]
Any ideas why is this happening?
I've been able to fix this by upgrading Kivy to version 2.0.0.

Xamarin ContentPage BackgroundImage property crashes app on Android

I'm using Xamarin Forms to produce a TabbedPage consisting of more ContentPages. This is the part of code causing trouble:
public void launchMainDesign(object s, EventArgs e) {
MainPage = new TabbedPage {
Children = {
new ContentPage {
Title = "Login",
Content = pages.loginContent,
BackgroundImage = "bgmain.jpg"
},
new ContentPage {
Title = "Sign Up",
Content = pages.signUpContent,
BackgroundImage = "bgmain.jpg"
}
}
};
}
It seems absolutely fine. I have both the images in my Drawable directory, with the build action set to "AndroidResource".
Whenever the launchMainDesign() function is fired by pressing a button, the app crashes immediately, both in emulator and a build version of the app on a tablet. Unfortunately, I can't test on iOS and WP.
I even tried putting the whole inside part of the function in a try/catch block and print out the exception, but the app just crashes nevertheless.
I am desperately trying to solve this simple problem for about a week now. No one seems to be having exactly the same issue as me. Weirdest thing is, I have a different app where I use exactly the same method and it works just fine. Can the Android Theme be causing this (I'm using Holo, in the working app, there's no theme specified)? That seems to be the only difference.
I also don't think this is caused by RAM struggles, as the image is only about 700 kilobytes (1080x1920) - for this example, I've only used one image.
It could be a memory issue, because even do the size is not big depending on the device resolution it might be trying to scale the image to the device dimensions.
Try checking this README:
https://github.com/xamarin/customer-success/blob/master/samples/Xamarin.Forms/SliderView/README.md
Explains Xamarin.Forms Android Image Memory Management so could help you get around the issue you might be having.

Using Cordova, is there a way to reference native icons?

I'm using Cordova 3.5 to build an app which contains a menu with pretty standard items in the list (home, contacts, etc.), and I want to use the native menu icons whenever possible. I believe those icons are already on the device as part of the OS, but I don't know if Cordova gives me a way to reference them.
I suppose I'd need to write a Javascript function to choose the right file name based on the platform, e.g.:
// this is pseudocode
var icon = '';
if (platform === 'android') {
icon = 'some/path/home.png';
} else {
icon = 'other/path/icon.home.png';
// or maybe a function such as the following exists:
// icon = cordova.getNativeIcon('icon.home.png');
}
$('.selector').css('background-image', icon);
Alternatively, I may be able to make do by referencing the files in CSS, e.g.:
.android .home-icon {
background-image: url('some/path/home.png');
}
.ios .home-icon {
background-image: url('other/path/icon.home.png');
}
So, how do folks handle this sort of thing in Cordova? Is there a function I can use to access native icons? Are folks just copying them into their projects? What's the best practice?
If you're working with Cordova, then you'll be working inside a web view provided by the host OS and you won't have direct access to any artwork. I've found that using icon fonts and CSS "themes" to work well enough, but that approach will replicate artwork already provided. There's extra work involved with theming for iOS 6 vs iOS 7 or 8, for example, but it's not as bad as it sounds.
IBM does have an article on partitioning your view between native and web controls, but it sounds a bit cumbersome. More details here: https://www.ibm.com/developerworks/community/blogs/worklight/entry/ios_combining_native_and_web_controls_in_cordova_based_applications

Android icon wrong in App Management app, but correct in Launcher

I have a simple Android app (built with Mono for Android), which has a problem with it's icon.
The icon is correct in Launcher and in Task Switcher, but
In Manage Apps and in Task Manager it's displayed a generic Android icon
I've checked the various density resources and the manifest and they all look correct.
(I'm seeing this on a Galaxy S phone and on a Nexus 7)
Most likely you set the icon property for your activities within AndroidManifest.xml, but did not set it for the application.
It occurs to me, that the app icon is somehow being cached in the app manager, so that deinstalling and reinstalling the app does not always change the icon properly. Rebooting the device could help.
Also i found this post very useful: adding application ids in gradle usually solves the problem.
Open "AndroidMenifest.xml" in the Package Explorer and click on the "Application" tab at the bottom. Look at the "icon" field and enter the location for your icon ( Ex: #drawable/iconimage). Next, go into the "AndroidManifest.xml" tab and look for android:icon=, adding the location to that as well (Ex: android:icon="#drawable/iconimage)
Make sure you have the same icon name in both locations!
Oleg and Collin are both right but for completeness - in a Mono app the icon can be set with attributes on the Application object (if you have one):
[Application(Label = "MyAppName", Icon = "#drawable/icon")]
class MyApp: Application
{ ...

Categories

Resources