Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CB-12129 (android): Add ability to set dialog style #103

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 52 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,63 @@ Report issues on the [Apache Cordova issue tracker](https://issues.apache.org/ji

## Methods

- `navigator.notification.setAndroidStyleName`
- `navigator.notification.alert`
- `navigator.notification.confirm`
- `navigator.notification.prompt`
- `navigator.notification.beep`

## navigator.notification.setAndroidStyleName

For Android platforms, allows specifying a custom style name to use with the dialogs.
The style name can be defined within a `styles.xml` file. The `stles.xml` file
is referenced in your config.xml file as a `<resource-file>`.

navigator.notification.setAndroidStyleName(styleName)

- __styleName__: Name of Android style. _(String)_


### Example

1. Create a `style.xml` with a custom dialog style (notice we give the style a name of `AlertDialogCustom` which will be used in our code later)(this file can go anywhere in your project, this example places it in the root):


<!-- styles.xml file -->
<color name="blue">#0000ff</color>
<color name="white">#ffffff</color>
<color name="black">#000000</color>
<style name="AlertDialogCustom" parent="Theme.AppCompat.Light.Dialog.Alert">
<!-- Used for button colors -->
<item name="android:colorAccent">@color/blue</item>
<!-- Used for the title and text -->
<item name="android:textColorPrimary">@color/black</item>
<!-- Used for the background -->
<item name="android:background">@color/white</item>

<!-- More styles could be added... -->
</style>

2. Reference your `styles.xml` file in your `config.xml` file so it gets copied to the correct location (since we placed `styles.xml` in our root, we just put the filename with no path, otherwise `src` is relative to your `config.xml` directory)

<!-- config.xml file -->
<widget>
<platform name="android">
<resource-file src="styles.xml" target="app/src/main/res/values/styles.xml" />
</platform>
</widget>

3. In your code, set the dialog style name to the one you used in `styles.xml`:


navigator.notification.setAndroidStyleName(
'AlertDialogCustom' // styleName
);

### Supported Platforms

- Android

## navigator.notification.alert

Shows a custom alert or dialog box. Most Cordova implementations use a native
Expand Down
28 changes: 23 additions & 5 deletions src/android/Notification.java
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,9 @@ Licensed to the Apache Software Foundation (ASF) under one
public class Notification extends CordovaPlugin {

private static final String LOG_TAG = "Notification";


private String androidStyleName = "";

public int confirmResult = -1;
public ProgressDialog spinnerDialog = null;
public ProgressDialog progressDialog = null;
Expand All @@ -78,8 +80,11 @@ public boolean execute(String action, JSONArray args, CallbackContext callbackCo
* be returned in the event of an invalid action.
*/
if(this.cordova.getActivity().isFinishing()) return true;

if (action.equals("beep")) {

if (action.equals("setAndroidStyleName")) {
this.setAndroidStyleName(args.getString(0));
}
else if (action.equals("beep")) {
this.beep(args.getLong(0));
}
else if (action.equals("alert")) {
Expand Down Expand Up @@ -122,6 +127,15 @@ else if (action.equals("progressStop")) {
// LOCAL METHODS
//--------------------------------------------------------------------------

/**
* Beep plays the default notification ringtone.
*
* @param styleName The name of the android xml defined style to override the alert dialog theme (default: THEME_DEVICE_DEFAULT_LIGHT)
*/
public void setAndroidStyleName(final String styleName) {
androidStyleName = styleName;
}

/**
* Beep plays the default notification ringtone.
*
Expand Down Expand Up @@ -484,7 +498,9 @@ public synchronized void progressStop() {
private AlertDialog.Builder createDialog(CordovaInterface cordova) {
int currentapiVersion = android.os.Build.VERSION.SDK_INT;
if (currentapiVersion >= android.os.Build.VERSION_CODES.HONEYCOMB) {
return new AlertDialog.Builder(cordova.getActivity(), AlertDialog.THEME_DEVICE_DEFAULT_LIGHT);
int id = androidStyleName == null || androidStyleName.isEmpty() ? AlertDialog.THEME_DEVICE_DEFAULT_LIGHT : cordova.getActivity().getResources().getIdentifier(androidStyleName, "style", cordova.getActivity().getPackageName());

return new AlertDialog.Builder(cordova.getActivity(), id);
} else {
return new AlertDialog.Builder(cordova.getActivity());
}
Expand All @@ -494,7 +510,9 @@ private AlertDialog.Builder createDialog(CordovaInterface cordova) {
private ProgressDialog createProgressDialog(CordovaInterface cordova) {
int currentapiVersion = android.os.Build.VERSION.SDK_INT;
if (currentapiVersion >= android.os.Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
return new ProgressDialog(cordova.getActivity(), AlertDialog.THEME_DEVICE_DEFAULT_LIGHT);
int id = androidStyleName == null || androidStyleName.isEmpty() ? AlertDialog.THEME_DEVICE_DEFAULT_LIGHT : cordova.getActivity().getResources().getIdentifier(androidStyleName, "style", cordova.getActivity().getPackageName());

return new ProgressDialog(cordova.getActivity(), id);
} else {
return new ProgressDialog(cordova.getActivity());
}
Expand Down
14 changes: 14 additions & 0 deletions www/notification.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,20 @@ var platform = require('cordova/platform');

module.exports = {

/**
* Open a native alert dialog, with a customizable title and button text.
*
* @param {String} styleName The name of the android xml defined style to override the alert dialog theme (default: THEME_DEVICE_DEFAULT_LIGHT)
*/
setAndroidStyleName: function (styleName) {
if (platform.id !== 'android') {
return;
}

const _styleName = (styleName || '');
exec(null, null, 'Notification', 'setAndroidStyleName', [_styleName]);
},

/**
* Open a native alert dialog, with a customizable title and button text.
*
Expand Down