Warum ist mein Button !Opak

prototype0815 · 9. Juli 2015

Hey folks, wieder ein kleines aber sehr nerviges Problem auf das ich trotz aller Bemühungen keine Lösung finde.

Ich habe ein ganze einfaches XML Layout, hier zu sehen...

XML

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/mainBgColor"
    &gt;


    &lt;ImageView
        android:id="@+id/ivBackgroundLanguages"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:background="@color/mainBgColor"
        android:paddingLeft="15dp"
        android:paddingRight="15dp"
        /&gt;


    &lt;TextView
        android:id="@+id/tvChooseLanguage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="35sp"
        android:textColor="@color/textColor"
        android:layout_marginBottom="35dp"
        android:layout_centerHorizontal="true"
        android:layout_above="@+id/spinLanguages"
        /&gt;


    &lt;Spinner
        android:id="@+id/spinLanguages"
        android:layout_width="250dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:paddingLeft="20dp"
        android:paddingRight="0dp"
        android:layout_marginBottom="10dp"
        &gt;&lt;/Spinner&gt;


    &lt;Button
        android:id="@+id/btnSaveLanguage"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/spinLanguages"
        android:layout_centerHorizontal="true"
        android:paddingLeft="45dp"
        android:paddingRight="45dp"
        android:alpha="1.0"
        /&gt;


&lt;/RelativeLayout&gt;

Alles anzeigen

Das ImageView dient als Hintergrund, da es aber nicht den ganzen Bildschirm einnimmt sondern nur in der Mitte sitzt, hab ich dem äußeren RelativLayout die gleich Hintergrundfarbe gegeben die das BG-Image hat.

Sobald ein Fragment das BG-Image überdeckt wird dieses mit folgender Methode aufgehellt...(Alphakanal)

Java

public static Drawable invertImage(Drawable drawable, boolean dark) {
    float alpha = 1.0f;


    if (dark)
//      alpha = 0.30f;
      alpha = 0.20f;


//    //To generate negative image
//    float[] colorMatrix_Negative = {
//            -1.0f, 0, 0, 0, 255, //red
//            0, -1.0f, 0, 0, 255, //green
//            0, 0, -1.0f, 0, 255, //blue
//            0, 0, 0, alpha, 0    //alpha
//    };
    //To make no changes except to the alpha channel
    float[] colorMatrix_Negative = {
            1, 0, 0, 0, 0, //red
            0, 1, 0, 0, 0, //green
            0, 0, 1, 0, 0, //blue
            0, 0, 0, alpha, 0    //alpha
    };
    ColorFilter colorFilter_Negative = new ColorMatrixColorFilter(colorMatrix_Negative);
    drawable.setColorFilter(colorFilter_Negative);
    return drawable;
  }

Alles anzeigen

Was nun sehr seltsam ist, ist das dass BG-Image durch alle mögliche Objekte hindurch zu sehen ist, z.B. meinen Save-Button !!! Obwohl ich diesen Objekten keine ausdrückliche Alphakanal Einstellung zugewiesen hab. Setze ich dennoch den Alphakanal meines Buttons auf 1.0f (undurchsichtig) so tut sich nicht die Bohne was dran...

[Blockierte Grafik: http://z34.imgup.net/button_opa3756.png]">

Ich hoffe ihr könnt mir weiter helfen.

LG proto

Ben · 13. Juli 2015

es wäre interessant wie die xml zu mainbgcolor und zu buttonStyleSmall aussieht

prototype0815 · 14. Juli 2015

appearance.xml - mit mainBgColor

XML

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;resources&gt;
    &lt;item name="listViewSelected" type="drawable"&gt;@android:color/holo_blue_light&lt;/item&gt;
    &lt;item name="listViewPressed" type="drawable"&gt;@android:color/holo_green_light&lt;/item&gt;


    &lt;!--&lt;item name="pagerTabStripBG" type="color"&gt;#2B3333&lt;/item&gt;--&gt;
    &lt;item name="pagerTabStripBG" type="color"&gt;#00A5E7&lt;/item&gt;
    &lt;item name="pagerTabStripText" type="color"&gt;#ffffffff&lt;/item&gt;


    &lt;item name="tableHead" type="color"&gt;#FF444444&lt;/item&gt;
    &lt;item name="paraTableHead" type="color"&gt;#ff33b5e5&lt;/item&gt;
    &lt;!--&lt;item name="tableGrid" type="color"&gt;#FFFFFFFF&lt;/item&gt;--&gt;
    &lt;item name="tableGrid" type="color"&gt;#FF444444&lt;/item&gt;


    &lt;item name="underline" type="color"&gt;#FF616161&lt;/item&gt;
    &lt;!--&lt;item name="underlineText" type="color"&gt;#FFBBBBBB&lt;/item&gt;--&gt;
    &lt;item name="underlineText" type="color"&gt;#FF888888&lt;/item&gt;


    &lt;item name="mainBgColor" type="color"&gt;#DAE1EB&lt;/item&gt;
    &lt;item name="mainBgColorWhite" type="color"&gt;#EEFFFFFF&lt;/item&gt;


    &lt;!--eine Überlegung wäre @android:color/primary_text_dark zu benutzen, da diese sich veränderet bei klick, hover,...--&gt;
    &lt;item name="textColor" type="color"&gt;#FF444444&lt;/item&gt;
    &lt;item name="hintTextColor" type="color"&gt;#777777&lt;/item&gt;


    &lt;item name="paulBlue" type="color"&gt;#00A5E7&lt;/item&gt;
    &lt;item name="shapeBorder" type="color"&gt;#2200A5E7&lt;/item&gt;


    &lt;item name="tableText" format="float" type="dimen"&gt;14.0&lt;/item&gt;






&lt;/resources&gt;

Alles anzeigen

ButtonStyleSmall ist in der Library XML attrs.xml - ein ausschnitt daraus...

XML

&lt;!-- ============= --&gt;
        &lt;!-- Button styles --&gt;
        &lt;!-- ============= --&gt;
        &lt;eat-comment /&gt;


        &lt;!-- Normal Button style. --&gt;
        &lt;attr name="buttonStyle" format="reference" /&gt;


        &lt;!-- Small Button style. --&gt;
        &lt;attr name="buttonStyleSmall" format="reference" /&gt;


        &lt;!-- Button style to inset into an EditText. --&gt;
        &lt;attr name="buttonStyleInset" format="reference" /&gt;


        &lt;!-- ToggleButton style. --&gt;
        &lt;attr name="buttonStyleToggle" format="reference" /&gt;

Alles anzeigen

Ben · 14. Juli 2015

<item name="mainBgColor" type="color">#DAE1EB</item>
nutz mal #FFDAE1EB

<item name="mainBgColorWhite" type="color">#EEFFFFFF</item>
warum EE?

außerdem weißt du dem bild nochmal einen hintergrund zu, warum, du willst doch nur das bild angezeigt bekommen oder?

prototype0815 · 14. Juli 2015

Zitat von ChampS

<item name="mainBgColor" type="color">#DAE1EB</item>
nutz mal #FFDAE1EB

macht keinen unterschied...

Zitat von ChampS

<item name="mainBgColorWhite" type="color">#EEFFFFFF</item>
warum EE?

ist wahrscheinlich ein überbleibsel von einer anderen Hintergrundfarbe.

Zitat von ChampS

außerdem weißt du dem bild nochmal einen hintergrund zu, warum, du willst doch nur das bild angezeigt bekommen oder?

das kann ich selbst noch gar nicht aufgefallen kann mir aber auch net erklären warum... entfernt, hatte keine Auswirkungen.

prototype0815 · 14. Juli 2015

seltsam ist das wenn ich die mainBgColor auf "#FF444444" ändere, sieht das ganze so aus, dann siehst du mal wie groß mein Image ist. Das man die Hintergrundfarbe durch das Image hindurch sieht ist ja normal (Alphakanal = 0.2f) allerdings nicht bei meinem verk***ten Button !!!

[Blockierte Grafik: http://s21.imgup.net/button_opa2859.png]">

Ben · 14. Juli 2015

vielleicht ist dein button garnicht durchsichtig sondern dein durchsichtiges bild liegt nur über dem button?

prototype0815 · 14. Juli 2015

da stellt sich mir dann die Frage in welcher Hierarchie die verschiedenen Elemente angeordnet werden. Sinnvoller weise sollten sie in der Reihenfolge übereinander gelegt werden wie ich sie im Sorcecode von oben nach unten schreibe..

XML

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/mainBgColor"
                android:padding="20dp"
    &gt;


    &lt;RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#FFFF0000"
        android:padding="20dp"
        &gt;


        &lt;RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#FF00FF00"
            android:padding="20dp"
            &gt;


            &lt;RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#FF0000FF"
                android:padding="20dp"
                &gt;


                &lt;!--&lt;ImageView--&gt;
                    &lt;!--android:id="@+id/ivBackgroundLanguages"--&gt;
                    &lt;!--android:layout_width="match_parent"--&gt;
                    &lt;!--android:layout_height="match_parent"--&gt;
                    &lt;!--android:layout_gravity="center"--&gt;
                    &lt;!--android:paddingLeft="15dp"--&gt;
                    &lt;!--android:paddingRight="15dp"--&gt;
                    &lt;!--/&gt;--&gt;
                &lt;!--android:background="@color/mainBgColor"--&gt;


                &lt;TextView
                    android:id="@+id/tvChooseLanguage"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textAppearance="?android:attr/textAppearanceLarge"
                    android:textSize="35sp"
                    android:textColor="@color/textColor"
                    android:layout_marginBottom="35dp"
                    android:layout_centerHorizontal="true"
                    android:layout_above="@+id/spinLanguages"
                    /&gt;


                &lt;Spinner
                    android:id="@+id/spinLanguages"
                    android:layout_width="250dp"
                    android:layout_height="wrap_content"
                    android:layout_centerInParent="true"
                    android:paddingLeft="20dp"
                    android:paddingRight="0dp"
                    android:layout_marginBottom="10dp"
                    &gt;&lt;/Spinner&gt;


                &lt;Button
                    android:id="@+id/btnSaveLanguage"
                    style="?android:attr/buttonStyleSmall"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/spinLanguages"
                    android:layout_centerHorizontal="true"
                    android:paddingLeft="45dp"
                    android:paddingRight="45dp"
                    /&gt;
            &lt;/RelativeLayout&gt;
        &lt;/RelativeLayout&gt;
    &lt;/RelativeLayout&gt;
&lt;/RelativeLayout&gt;

Alles anzeigen

ergibt dieses ergebnis...

[Blockierte Grafik: http://q78.imgup.net/button_opa01f6.png]">

die Elemente werden also nacheinander, so wie sie im Quelltext stehen übereinander gelegt.

hier hab ich mal das ImageView statt ganz oben im Quelltext, nach ganz unten geschrieben.
Am oberen text erkennt man das er vom ImageView überlagert wird, das ist der Fall wenn das ImageView ganz unten im Quelltext steht.
[Blockierte Grafik: http://j30t.imgup.net/button_opabd24.jpg]

aber es war ein guter Gedanke ChampS

Ben · 14. Juli 2015

war nur ne idee, ich hab sonst nämlich keinen Anhaltspunkt mehr woran es liegen kann xD

Warum ist mein Button !Opak

Jetzt mitmachen!

Teilen