Wie kann ich eine benutzerdefinierte Aktionsleiste mit benutzerdefinierten Schaltflächen in Android implementieren?

Question

Ich möchte ActionBar Gewohnheit implementieren, die wie folgt aussehen muss:

So Fragen:

1. Wie kann ich eine Schaltfläche wie benutzerdefinierte Ansicht implementieren: nur einige Bild? Wie kann ich eine Linie auf die Oberseite der ActionBar zeichnen?
2. Und wie kann ich Tasten ohne Trennlinien implementieren: Hinzufügen von Tabs auf der ActionBar oder was?

Answer 1

Das ist so ziemlich so nah wie Sie, wenn Sie die ActionBar APIs verwenden bekommen möchten. Ich bin mir nicht sicher, ob Sie einen Farbstreifen über die ActionBar platzieren können, ohne etwas seltsames Window Hacken zu tun, es lohnt sich nicht. Soweit das Ändern der MenuItems geht, können Sie diese enger über einen Stil machen. Es wäre so, aber ich habe es nicht getestet.

<style name="MyTheme" parent="android:Theme.Holo.Light"> 
    <item name="actionButtonStyle">@style/MyActionButtonStyle</item> 
</style> 

<style name="MyActionButtonStyle" parent="Widget.ActionButton"> 
    <item name="android:minWidth">28dip</item> 
</style> 

Hier ist, wie das benutzerdefinierte Layout Ihrer ActionBar aufzublasen und hinzuzufügen.

// Inflate your custom layout 
    final ViewGroup actionBarLayout = (ViewGroup) getLayoutInflater().inflate(
      R.layout.action_bar, 
      null); 

    // Set up your ActionBar 
    final ActionBar actionBar = getActionBar(); 
    actionBar.setDisplayShowHomeEnabled(false); 
    actionBar.setDisplayShowTitleEnabled(false); 
    actionBar.setDisplayShowCustomEnabled(true); 
    actionBar.setCustomView(actionBarLayout); 

    // You customization 
    final int actionBarColor = getResources().getColor(R.color.action_bar); 
    actionBar.setBackgroundDrawable(new ColorDrawable(actionBarColor)); 

    final Button actionBarTitle = (Button) findViewById(R.id.action_bar_title); 
    actionBarTitle.setText("Index(2)"); 

    final Button actionBarSent = (Button) findViewById(R.id.action_bar_sent); 
    actionBarSent.setText("Sent"); 

    final Button actionBarStaff = (Button) findViewById(R.id.action_bar_staff); 
    actionBarStaff.setText("Staff"); 

    final Button actionBarLocations = (Button) findViewById(R.id.action_bar_locations); 
    actionBarLocations.setText("HIPPA Locations"); 

Hier ist das benutzerdefinierte Layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:enabled="false" 
    android:orientation="horizontal" 
    android:paddingEnd="8dip" > 

    <Button 
     android:id="@+id/action_bar_title" 
     style="@style/ActionBarButtonWhite" /> 

    <Button 
     android:id="@+id/action_bar_sent" 
     style="@style/ActionBarButtonOffWhite" /> 

    <Button 
     android:id="@+id/action_bar_staff" 
     style="@style/ActionBarButtonOffWhite" /> 

    <Button 
     android:id="@+id/action_bar_locations" 
     style="@style/ActionBarButtonOffWhite" /> 

</LinearLayout> 

Hier ist das Farbstreifenlayout: es verwenden zu können, benutzen Sie einfach merge in welchem ​​Layout, das Sie in setContentView aufzuzublasen.

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="@dimen/colorstrip" 
    android:background="@android:color/holo_blue_dark" /> 

Hier sind die Button Stile:

<style name="ActionBarButton"> 
    <item name="android:layout_width">wrap_content</item> 
    <item name="android:layout_height">wrap_content</item> 
    <item name="android:background">@null</item> 
    <item name="android:ellipsize">end</item> 
    <item name="android:singleLine">true</item> 
    <item name="android:textSize">@dimen/text_size_small</item> 
</style> 

<style name="ActionBarButtonWhite" parent="@style/ActionBarButton"> 
    <item name="android:textColor">@color/white</item> 
</style> 

<style name="ActionBarButtonOffWhite" parent="@style/ActionBarButton"> 
    <item name="android:textColor">@color/off_white</item> 
</style> 

die Farben und Dimensionen Hier I verwendet:

<color name="action_bar">#ff0d0d0d</color> 
<color name="white">#ffffffff</color> 
<color name="off_white">#99ffffff</color> 

<!-- Text sizes --> 
<dimen name="text_size_small">14.0sp</dimen> 
<dimen name="text_size_medium">16.0sp</dimen> 

<!-- ActionBar color strip --> 
<dimen name="colorstrip">5dp</dimen> 

Wenn Sie es mehr als diese anpassen möchten , können Sie in Betracht ziehen, die ActionBar überhaupt nicht zu verwenden, aber ich würde das nicht empfehlen.Sie können auch durch die Android Design Guidelines betrachten Lesen eine bessere Vorstellung davon zu bekommen, wie Sie Ihre ActionBar.

entwerfen Wenn Sie die ActionBar und Ihr eigenes Layout verzichten wählen verwenden, stattdessen sollten Sie sicher sein aktions Lage Toasts, wenn Benutzer lange hinzufügen Drücke auf "MenuItems". Dies kann leicht erreicht werden using this Gist.

Answer 2

1 können Sie ein ziehbar

verwenden

<menu xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@+id/menu_item1" 
     android:icon="@drawable/my_item_drawable" 
     android:title="@string/menu_item1" 
     android:showAsAction="ifRoom" /> 
</menu> 

2 einen Stil für die Aktionsleiste Erstellen und einen benutzerdefinierten Hintergrund verwenden:

<resources> 
    <!-- the theme applied to the application or activity --> 
    <style name="CustomActivityTheme" parent="@android:style/Theme.Holo"> 
     <item name="android:actionBarStyle">@style/MyActionBar</item> 
     <!-- other activity and action bar styles here --> 
    </style> 
    <!-- style for the action bar backgrounds --> 
    <style name="MyActionBar" parent="@android:style/Widget.Holo.ActionBar"> 
     <item name="android:background">@drawable/background</item> 
     <item name="android:backgroundStacked">@drawable/background</item> 
     <item name="android:backgroundSplit">@drawable/split_background</item> 
    </style> 
</resources> 

3 Stil wieder android: actionBarDivider

Die android documentation ist sehr nützlich dafür.

Answer 3

Bitte schreiben Sie folgenden Code in menu.xml Datei:

<menu xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:my_menu_tutorial_app="http://schemas.android.com/apk/res-auto" 
     xmlns:tools="http://schemas.android.com/tools" 
     tools:context="com.example.mymenus.menu_app.MainActivity"> 
<item android:id="@+id/item_one" 
     android:icon="@drawable/menu_icon" 
     android:orderInCategory="l01" 
     android:title="Item One" 
     my_menu_tutorial_app:showAsAction="always"> 
     <!--sub-menu--> 
     <menu> 
      <item android:id="@+id/sub_one" 
       android:title="Sub-menu item one" /> 
      <item android:id="@+id/sub_two" 
       android:title="Sub-menu item two" /> 
     </menu> 

Auch diesen Java-Code in Aktivitätsklasse Datei schreiben:

public boolean onOptionsItemSelected(MenuItem item) 
{ 
    super.onOptionsItemSelected(item); 
    Toast.makeText(this, "Menus item selected: " + 
     item.getTitle(), Toast.LENGTH_SHORT).show(); 
    switch (item.getItemId()) 
    { 
     case R.id.sub_one: 
      isItemOneSelected = true; 
      supportInvalidateOptionsMenu(); 
      return true; 
     case MENU_ITEM + 1: 
      isRemoveItem = true; 
      supportInvalidateOptionsMenu(); 
      return true; 
     default: 
      return false; 
    } 
} 

Dies ist die einfachste Art und Weise Menüs in der Aktionsleiste angezeigt werden soll.