I have a normal code for opening Navigation Drawer. I want to open the same Navigation Drawer when an HTML button is clicked in WebView
. I can have a Toast
or any other simple functions on HTML button click using WebAppInterface
. But how to open Drawer in this case?
HTML code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function showAndroidDialog() {
Luke.showDialog();
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">Second Page</p>
<button type="button" onClick="showAndroidDialog()">OK</button>
</body>
</html>
RiverFragment.java
public class RiverFragment extends Fragment{
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Retrieving the currently selected item number
int position = getArguments().getInt("position");
// List of rivers
String[] rivers = getResources().getStringArray(R.array.rivers);
// Creating view correspoding to the fragment
View v = inflater.inflate(R.layout.fragment_layout, container, false);
// Getting reference to the TextView of the Fragment
TextView tv = (TextView) v.findViewById(R.id.tv_content);
// Setting currently selected river name in the TextView
tv.setText(rivers[position]);
// Updating the action bar title
getActivity().getActionBar().setTitle(rivers[position]);
return v;
}
}
MainActivity.java
public class MainActivity extends Activity {
// Within which the entire activity is enclosed
DrawerLayout mDrawerLayout;
// ListView represents Navigation Drawer
ListView mDrawerList;
// ActionBarDrawerToggle indicates the presence of Navigation Drawer in the action bar
ActionBarDrawerToggle mDrawerToggle;
// Title of the action bar
String mTitle="";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mTitle = (String) getTitle();
// Getting reference to the DrawerLayout
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
mDrawerList = (ListView) findViewById(R.id.drawer_list);
// Getting reference to the ActionBarDrawerToggle
mDrawerToggle = new ActionBarDrawerToggle( this,
mDrawerLayout,
R.drawable.ic_drawer,
R.string.drawer_open,
R.string.drawer_close){
/** Called when drawer is closed */
public void onDrawerClosed(View view) {
getActionBar().setTitle(mTitle);
invalidateOptionsMenu();
}
/** Called when a drawer is opened */
public void onDrawerOpened(View drawerView) {
getActionBar().setTitle("Select a river");
invalidateOptionsMenu();
}
};
// Setting DrawerToggle on DrawerLayout
mDrawerLayout.setDrawerListener(mDrawerToggle);
// Creating an ArrayAdapter to add items to the listview mDrawerList
ArrayAdapter<String> adapter = new ArrayAdapter<String>(
getBaseContext(),
R.layout.drawer_list_item ,
getResources().getStringArray(R.array.rivers)
);
// Setting the adapter on mDrawerList
mDrawerList.setAdapter(adapter);
// Enabling Home button
getActionBar().setHomeButtonEnabled(true);
// Enabling Up navigation
getActionBar().setDisplayHomeAsUpEnabled(true);
// Setting item click listener for the listview mDrawerList
mDrawerList.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent,
View view,
int position,
long id) {
// Getting an array of rivers
String[] rivers = getResources().getStringArray(R.array.rivers);
//Currently selected river
mTitle = rivers[position];
// Creating a fragment object
RiverFragment rFragment = new RiverFragment();
// Creating a Bundle object
Bundle data = new Bundle();
// Setting the index of the currently selected item of mDrawerList
data.putInt("position", position);
// Setting the position to the fragment
rFragment.setArguments(data);
// Getting reference to the FragmentManager
FragmentManager fragmentManager = getFragmentManager();
// Creating a fragment transaction
FragmentTransaction ft = fragmentManager.beginTransaction();
// Adding a fragment to the fragment transaction
ft.replace(R.id.content_frame, rFragment);
// Committing the transaction
ft.commit();
// Closing the drawer
mDrawerLayout.closeDrawer(mDrawerList);
}
});
}
@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
mDrawerToggle.syncState();
}
/** Handling the touch event of app icon */
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (mDrawerToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
/** Called whenever we call invalidateOptionsMenu() */
@Override
public boolean onPrepareOptionsMenu(Menu menu) {
// If the drawer is open, hide action items related to the content view
boolean drawerOpen = mDrawerLayout.isDrawerOpen(mDrawerList);
menu.findItem(R.id.action_settings).setVisible(!drawerOpen);
return super.onPrepareOptionsMenu(menu);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
Have a look at this . I guess using an onTouchListener()
and a View
id to intercept a call to the specific button on the WebView
you could do a drawerLayout.openDrawer()
.
You can achieve the same functionality by the interface itself
JavaScriptInterface jsInterface = new JavaScriptInterface();
webView.getSettings().setJavaScriptEnabled(true);
webView.addJavascriptInterface(jsInterface, "Android");
Interface class will be:
public class JavaScriptInterface {
public void openDrawer(){
yourdrawerlayout.open(Gravity.LEFT);
}
}
You need call this openDrawer
method from html like below
document.getElementById("button").addEventListener("click", function() {
Android.openDrawer();
});
You have defined showAndroidDialog()
method on Button click in your HTML code.
Luke.showDialog();
to interact with android view components.
So you have to call showDialog()
method in your JavascriptInterface
to open drawer progrmatically
You can add JavascriptInterface
like this:
myWebView.addJavascriptInterface(new WebAppInterface(this), "Luke");
Your WebAppInterface should be like this:
public class WebAppInterface {
Context mContext;
/** Instantiate the interface and set the context */
WebAppInterface(Context c) {
mContext = c;
}
@JavascriptInterface // must be added for API 17 or higher
public void showDialog() {
mDrawerLayout.openDrawer(Gravity.LEFT); // open navigation drawer
}
}
Hope this helps!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.