TabHost/TabWidget - Hintergrund skalieren?

Question

Ich muss meine TabWidget-Hintergrundbilder so skalieren, dass sie das Seitenverhältnis beibehalten.
Ich verwende einen TabHost mit einem TabWidget. Ich verwende dann setBackgroundDrawable, um die Bilder zu setzen.

Ich fand eine enge Antwort hier - Background in tab widget ignore scaling. Ich bin mir jedoch nicht sicher, wo ich den neuen Drawable-Code hinzufügen soll. (Beim Arbeiten mit dem HelloTabWidget-Beispiel verwendet keines meiner Module RelativeLayout und ich sehe kein Layout für "Tabcontent".)

Ich habe auch diesen Thread gefunden - Android: Scale a Drawable or background image?. Demnach klingt es so, als würde ich meine Bilder vorskalieren müssen, was den ganzen Zweck, sie skalierbar zu machen, zunichte macht.

Ich habe auch einen anderen Thread gefunden, in dem jemand die Drawable-Klasse unterklassifiziert hat, so dass sie entweder nicht skalieren würde, oder sie würde richtig skalieren. Ich kann es jetzt nicht finden, aber das scheint eine Menge zu sein, wenn man einfach etwas Einfaches wie mTab.setScaleType (centerInside) machen sollte.

Hier ist mein Code:

main.xml:

<?xml version="1.0" encoding="utf-8"?> 
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/tabhost" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:background="@drawable/main_background"> 
    <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent"> 
    <FrameLayout 
      android:id="@android:id/tabcontent" 
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent" 
      android:layout_weight="1"/>   
    <TabWidget 
      android:id="@android:id/tabs" 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_weight="0"/> 
    </LinearLayout> 
</TabHost> 

Haupttätigkeit:

 tabHost.setOnTabChangedListener(new OnTabChangeListener() { 
      TabHost changedTabHost = getTabHost(); 
      TabWidget changedTabWidget = getTabWidget(); 
      View changedView = changedTabHost.getTabWidget().getChildAt(0); 

      public void onTabChanged(String tabId) { 
       int selectedTab = changedTabHost.getCurrentTab(); 
       TabWidget tw = getTabWidget(); 

       if(selectedTab == 0) { 
        //setTitle("Missions Timeline"); 
        View tempView = tabHost.getTabWidget().getChildAt(0); 
        tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_timeline_on)); 
        tempView = tabHost.getTabWidget().getChildAt(1); 
        tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_map_off)); 
        tempView = tabHost.getTabWidget().getChildAt(2); 
        tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_search_off)); 
        tempView = tabHost.getTabWidget().getChildAt(3); 
        tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_news_off)); 
        tempView = tabHost.getTabWidget().getChildAt(4); 
        tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_license_off)); 
          //ImageView iv = (ImageView)tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.icon); 
          //iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_timeline_on)); 
          //iv = (ImageView)tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.icon); 
          //iv.setImageDrawable(getResources().getDrawable(R.drawable.tab_map_off)); 
        } else if (selectedTab == 1) { 
         //setTitle("Spinoffs Around You"); 
         View tempView = tabHost.getTabWidget().getChildAt(0); 
         tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_timeline_off)); 
         tempView = tabHost.getTabWidget().getChildAt(1); 
         tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_map_on)); 
         tempView = tabHost.getTabWidget().getChildAt(2); 
         tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_search_off)); 
         tempView = tabHost.getTabWidget().getChildAt(3); 
         tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_news_off)); 
         tempView = tabHost.getTabWidget().getChildAt(4); 
         tempView.setBackgroundDrawable(getResources().getDrawable(R.drawable.tab_license_off)); 
} 

ich auch Bilder versucht 9patch, aber sie aufzuwickeln zu klein zu sein.

Also, was ist der beste Weg, um darüber zu gehen?

Answer 1

Ich vermute, der Grund, warum Sie kämpfen, um eine Out-of-the-Box-Art zu finden, um Hintergrundbildskalierung durchzuführen ist, dass es im Allgemeinen nicht als gute Praxis angesehen wird. Skalierung von Bildern neigt dazu, Artefakte und Streifenbildung zu verursachen, die Ihre Benutzeroberfläche unangenehm aussehen lassen. Die Ausnahme dazu ist in einer Bildansicht, aber ich würde argumentieren, dass die Skalierungsunterstützung dieser Klasse eher dazu gedacht ist, Dinge wie Fotos oder Webinhalte (d. H. Bilder, die Sie nicht mit Ihrer App geliefert haben) zu unterstützen.

Ihr UI-Layout sollte so entworfen werden, dass alle ressourcenbasierten Hintergrundbilder auf die richtige Auflösung für die Dichte/Bildschirmgröße des Geräts vorskaliert werden. Mit anderen Worten, Sie sollten mehrere Versionen jedes Zeichenzeichens bereitstellen, um für mehrere Bildschirmdichten und -größen zu sorgen, indem Sie die Namenskonvention für Ressourcenordner verwenden, die im Entwicklerhandbuch Supporting Multiple Screens beschrieben wird.

Die Benutzeroberfläche sollte dann so ausgelegt werden, dass geringfügige Unterschiede der Bildschirmgröße zwischen Geräten gehandhabt werden können, ohne dass Hintergrundbilder der enthaltenen Ansichten skaliert werden müssen. Offensichtlich weiß ich nicht, wie Ihre vorgeschlagene Benutzeroberfläche aussieht, daher ist es schwierig, konkrete Vorschläge zu machen, aber im Allgemeinen verwende ich einfache Hintergrundblockfarben oder ShapeDrawable s, um den Abstand zwischen den Ansichten dynamisch zu füllen.

Wenn Sie jedoch wirklich wirklich sicher sind, dass Sie Ihre Hintergrundbilder trotz der Predigt oben skalieren möchten :-), warum nicht versuchen, eine ScaleDrawable zu verwenden, um Ihre vorhandenen Zeichen zu verpacken?

Wenn Sie die Höhe und Breite sowohl Ihre Ansicht und Hintergrundbild ziehbar kennen, dann können Sie so etwas wie:

Drawable backgroundDrawable = getResources().getDrawable(R.drawable.tab_license_off); 
tempView.setBackgroundDrawable(
    new ScaleDrawable(
     backgroundDrawable, 
     Gravity.CENTER, 
     tempView.getWidth()/backgroundDrawable.getIntrinsicWidth(), 
     tempView.getHeight()/backgroundDrawable.getIntrinsicHeight()); 

Answer 2

Check this out und lassen Sie mich wissen, ob es für Sie gearbeitet.

Custom Android Tab