I'm using Titanium version 3.1.3 and alloy framework. I implemented the action bar in my app; but in the screen with tab groups in it, the title is missing from action bar. Only the icon is getting displayed in it. From this - https://jira.appcelerator.org/browse/TIMOB-11645, I can see that, this is fixed in SDK version: 3.1.0.v20130320190115. But still, I'm not able to figure out why.
I tried setting the title of action bar through code like this
var actionBar;
if (Ti.Platform.osname === "android") {
if (! $.tab.activity) {
Ti.API.error("Can't access action bar on a lightweight window.");
} else {
actionBar = $.tab.getActivity().actionBar;
if (actionBar) {
alert("true");
//actionBar.title = "TITLE";
actionBar.setTitle("TITLE");
}
}
}
Please help. Thanks in advance!
In order to get access to some ActionBar methods and properties, like the title, your code needs to be run after the tabgroup is opened.
In your view, you can add event listener like this:
<TabGroup onOpen="doOpen">
....
</TabGroup>
Then in your controller, put your code in the callback:
function doOpen(){
var actionBar;
if (Ti.Platform.osname === "android") {
if (! $.tab.activity) {
Ti.API.error("Can't access action bar on a lightweight window.");
} else {
actionBar = $.tab.getActivity().actionBar;
if (actionBar) {
alert("true");
//actionBar.title = "TITLE";
actionBar.setTitle("TITLE");
}
}
}
}
I tested your code in the open event callback using SDK 3.2.1, and it worked fine.
Here is another example for modifying the ActionBar title.
Related
I'm using a MasterDetail page and the content pages reacheable from the Master are quite long. I'm trying the app on Android devices, and if I access one of those pages creating a new NavigationPage they show up correctly, but if I push them into the navigation stack, or if I go back to them from another page into the stack, the scroll doesn't work anymore.
This is the code for the creation of NavigationPage:
void OnItemSelected(object sender, SelectedItemChangedEventArgs e) {
var item = e.SelectedItem as IMenuItem;
if (item != null && item.SubmitPageType != null) {
Detail = new NavigationPage((Page)Activator.CreateInstance(item.SubmitPageType));
masterPage.ListView.SelectedItem = null;
IsPresented = false;
}
}
and this is the code that I use to push the same page into the navigation stack
this.Navigation.PushAsync(new MyPage());
In Xaml, I've tried using ScrollView into the ContentPage.Content element, but it doesn' work and it cuts out part of my layout at the bottom of the page.
Has anyone experienced similar problems with NavigationPage and content scrolling? Can anyone help me?
Thanks
When I face simillar problem, this code in custom NavigationPageRenderer helps me
[assembly: ExportRenderer(typeof(YOUR_CUSTOM_NAV_PAGE), typeof(NoAnimationNavigationPageRenderer))]
namespace CanPay.Mobile.Droid.Renderers
{
public class NoAnimationNavigationPageRenderer : NavigationPageRenderer
{
protected override void SetupPageTransition(FragmentTransaction transaction, bool isPush)
{
transaction.SetCustomAnimations(0, 0, 0, 0);
}
}
}
I'm running into a strange issue when adding a Toolbar to my Form in my Codenameone app. If I set a toolbar on my form, it shows another title with the toolbar hamburger and new title below the title of the previous form instead of replacing it like I would expect. It looks like this:
The functionality works fine replacing the old title like I would expect when I run in the Codenameone simulator, but I get this weird behavior shown in the image when I make an Android build and run it on a Nexus 5 (6.0.1). The back arrow and "12 of 12" is the title from the previousForm
This is my code, am I doing anything wrong here with the Toolbar usage?
void goShowResource(final Form previousForm) {
previous = previousForm;
final Toolbar bar = new Toolbar();
final Form rd = new Form("resource details");
final Resource thisResource = this;
rd.setToolbar(bar);
bar.addCommandToSideMenu(new Command("command 1") {
#Override
public void actionPerformed(ActionEvent evt) {
AddResources ar = new AddResources(settings, thisResource);
ar.goAddResources(rd);
}
});
bar.addCommandToSideMenu(new Command("command 2") {
#Override
public void actionPerformed(ActionEvent evt){
UpdateResource ur = new UpdateResource(settings);
ur.goUpdateResource(rd, thisResource);
}
});
rd.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
showDetails(rd);
rd.show();
}
edit: Additonal info, if I open the sidemenu once, the old title bar at the top shrinks away, and I'm left with the the single correct yet incorrectly formatted title area.
You should use the Toolbar for all the forms in the app or disable the default which is native menu bar when working with the toolbar. You can do the latter by editing the theme and selecting the constants tab then pressing "Add" and selecting commandBehavior=Side.
Android currently defaults to the native ActionBar behavior and Toolbar implicitly overrides that, however when a transition occurs from the native to the lightweight component things can get pretty hairy (and might also look unnatural) so we recommend picking one UI paradigm and going with it.
Since the ActionBar is a volatile API we recommend Toolbar going forward as its far more customizable and gives us a lot of control.
This can be fixed by removing all command from the form after setting the toolbar, then add a fresh back command to the toolbar if required.
void goShowResource(final Form previousForm) {
previous = previousForm;
final Toolbar bar = new Toolbar();
final Form rd = new Form("resource details");
final Resource thisResource = this;
rd.removeAllCommands();
rd.setBackCommand(null);
rd.setToolbar(bar);
//Add back command
Command back = new Command("back") {
#Override
public void actionPerformed(ActionEvent evt) {
previousForm.showBack();
}
};
bar.addCommandToSideMenu(back);
bar.addCommandToSideMenu(new Command("command 1") {
#Override
public void actionPerformed(ActionEvent evt) {
AddResources ar = new AddResources(settings, thisResource);
ar.goAddResources(rd);
}
});
bar.addCommandToSideMenu(new Command("command 2") {
#Override
public void actionPerformed(ActionEvent evt){
UpdateResource ur = new UpdateResource(settings);
ur.goUpdateResource(rd, thisResource);
}
});
rd.setLayout(new BoxLayout(BoxLayout.Y_AXIS));
showDetails(rd);
rd.show();
}
This is a short question:
I'm trying to force the action bar (used by a Toolbar) to use LTR alignment. I've succeeded making the layout itself use LTR, but not the "up" button (as I've done here, before Toolbar was introduced) .
It seems this view doesn't have an ID, and I think using getChildAt() is too risky.
Can anyone help?
The answer
Here's one way I've found to solve this, based on this answer .
I made it so that it is guarranteed to find only the "up" button, and whatever it does, it will revert back to the previous state it was before.
Here's the code:
#TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR1)
#Override
public boolean onCreateOptionsMenu(final Menu menu)
{
// <= do the normal stuff of action bar menu preparetions
if(VERSION.SDK_INT>=VERSION_CODES.JELLY_BEAN_MR1&&getResources().getConfiguration().getLayoutDirection()==View.LAYOUT_DIRECTION_RTL)
{
final ArrayList<View> outViews=new ArrayList<>();
final CharSequence previousDesc=_toolbar.getNavigationContentDescription();
for(int id=0;;++id)
{
final String uniqueContentDescription=Integer.toString(id);
_toolbar.findViewsWithText(outViews,uniqueContentDescription,View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
if(!outViews.isEmpty())
continue;
_toolbar.setNavigationContentDescription(uniqueContentDescription);
_toolbar.findViewsWithText(outViews,uniqueContentDescription,View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
if (outViews.isEmpty())
if (BuildConfig.DEBUG)
throw new RuntimeException(
"You should call this function only when the toolbar already has views");
else
break;
outViews.get(0).setRotation(180f);
break;
}
_toolbar.setNavigationContentDescription(previousDesc);
}
//
return super.onCreateOptionsMenu(menu);
}
It seems this view doesn't have an ID
You're right, the navigation view is created programmatically and never sets an id. But you can still find it by using View.findViewsWithText.
View.findViewsWithText comes with two flags:
View.FIND_VIEWS_WITH_TEXT
View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION
The navigation view's default content description is "Navigate up" or the resource id is abc_action_bar_up_description for AppCompat and action_bar_up_description for the framework's, but you can easily apply your own using Toolbar.setNavigationContentDescription.
Here's an example implementation:
final Toolbar toolbar = ...;
toolbar.setNavigationContentDescription("up");
setActionBar(toolbar);
final ArrayList<View> outViews = Lists.newArrayList();
toolbar.findViewsWithText(outViews, "up", View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
outViews.get(0).setRotation(180f);
Results
if(Alloy.Globals.isAndroid){//if platform is android
$.tabGroup.addEventListener("open", function(e) {
var activity = $.tabGroup.getActivity();// I use tabgroup. get activity
var actionBar = activity.actionBar;
actionBar.icon =Ti.App.Android.R.drawable.logo;//this code not working
activity.onCreateOptionsMenu = function(e) {
var menuItem = e.menu.add({
title : "Refresh",
showAsAction : Ti.Android.SHOW_AS_ACTION_ALWAYS,
icon: Titanium.App.Android.R.drawable.ic_action_refresh //this code working right
});
menuItem.addEventListener("click", refreshMain);
};
activity.invalidateOptionsMenu();
});
}
I want set actionBar icon. Menu item icon is working right but actionBar icon not working. Where am I doing wrong?
I would like to dynamically change the "home" icon in the ActionBar. This is easily done in v14 with ActionBar.setIcon(...), but I can't find anyway to accomplish this in previous versions.
If your actionbar works like Sherlock and is based on menu items, this is my solution:
#Override
public boolean onPrepareOptionsMenu(Menu menu) {
MenuItem switchButton = menu.findItem(R.id.SwitchSearchOption);
if(searchScriptDisplayed){
switchButton.setIcon(R.drawable.menu_precedent);
}else{
switchButton.setIcon(R.drawable.icon_search);
}
return super.onPrepareOptionsMenu(menu);
}
If you are using the ActionbarCompat code provided by google, you can access the home icon via the ActionBarHelperBase.java class for API v4 onwards.
//code snippet from ActionBarHelperBase.java
...
private void setupActionBar() {
final ViewGroup actionBarCompat = getActionBarCompat();
if (actionBarCompat == null) {
return;
}
LinearLayout.LayoutParams springLayoutParams = new LinearLayout.LayoutParams(
0, ViewGroup.LayoutParams.MATCH_PARENT);
springLayoutParams.weight = 1;
// Add Home button
SimpleMenu tempMenu = new SimpleMenu(mActivity);
SimpleMenuItem homeItem = new SimpleMenuItem(tempMenu,
android.R.id.home, 0, mActivity.getString(R.string.app_name));
homeItem.setIcon(R.drawable.ic_home_ftn);
addActionItemCompatFromMenuItem(homeItem);
// Add title text
TextView titleText = new TextView(mActivity, null,
R.attr.actionbarCompatTitleStyle);
titleText.setLayoutParams(springLayoutParams);
titleText.setText(mActivity.getTitle());
actionBarCompat.addView(titleText);
}
...
You should be able to modify the code to the home button accessible to the activities that extend ActionBarActivity and change it that way.
Honeycomb seems a little harder and it doesn't seem to give such easy access. At a guess, its id should also be android.R.id.home so you may be able to pull that from the view in ActionBarHelperHoneycomb.java
I would say you do something like this :
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_menu_drawer);
see the link How to change the icon actionBarCompat
The ActionBar will use the android:logo attribute of your manifest, if one is provided. That lets you use separate drawable resources for the icon (Launcher) and the logo (ActionBar, among other things).