Android-bibliotek för att rendera grandienter med border

Diskussion i 'Frågor, support och diskussion' startad av johle, 8 jun 2010.

  1. johle

    johle Kid Droid Medlem

    Blev medlem:
    8 jun 2010
    Inlägg:
    35
    Mottagna gillanden:
    0

    MINA ENHETER

    Hej!

    Jag skall rendera små gradient-boxar med en svart border kring, som i bilden nedan. Någon som har en aning om hur detta är möjligt att åstadkomma?

    Länk:
    http://files.lennefalk.com/struktur-med-gradient.png

    Jag har bara använt de inbyggda biblioteken för Android hittills men jag har inte en susning om hur detta skulle kunna åstadkommas. Externa grafikbibliotek?

    Varenda idé uppskattas!

    Tack på förhand!

    MVH

    Johan

    (Jag blev tipsad att posta här ifrån Sweclockers forum så jag följer detta tips och frågar här :D )
     
  2. coolof

    coolof Teen Droid Medlem

    Blev medlem:
    30 okt 2009
    Inlägg:
    360
    Mottagna gillanden:
    12

    MINA ENHETER

    Hur menar du mer exakt?

    Jag vet att man kan göra det med xml men jag vet då inte hur dynamiskt det skulle kunna bli exempelvis. Kan enbart den sidan men om det skulle fungera kan jag slänga ihop en snabb liten guide :)
     
  3. meatsushi

    meatsushi Youth Droid Medlem

    Blev medlem:
    30 mar 2010
    Inlägg:
    101
    Mottagna gillanden:
    13

    MINA ENHETER

    Finns flera approacher för gradienter, men GradientDrawable i kombination med LayerDrawable (för att lägga kanten över gradienten) borde funka för dig.
     
  4. johle

    johle Kid Droid Medlem

    Blev medlem:
    8 jun 2010
    Inlägg:
    35
    Mottagna gillanden:
    0

    MINA ENHETER

    Kul med snabba svar! :)

    Oj, kul att ni svarade så snabbt!

    Yes, jag antar att jag inte riktigt var så specifik. Problemet är väl egentligen uppdelat i två delar.

    Dels den övre "titel"-gradienten där det står "struktur - nivå 1". Denna misstänker jag går att generera via XML då jag har sett en liknande grön gradient i t.ex. Spotifys app?

    Sedan har vi de "små" gradienterna i en List- eller ArrayAdapter (minns inte på rak arm vilken man använder). Dessa ska helst genereras utifrån nån typ av värde, typ mella 0 och 1 där 0 ger en näst intill vit/rosa gradient och där 1 är väldigt intensiv rosa/lila som i "titel"-gradienten. Båda utgår från samma "färg", dvs rosa/lila.

    Jag tänkte faktiskt inte på att det var två problem från en början. Men som sagt, titeln går via XML antar jag, medan det andra problemet mer blir någon form av renderingskod? Dessa (de små boxarna) avgörs runtime, dvs värdet som färgen beror av ska kunna varieras dynamiskt.

    Som sagt, rätt knepigt (tycker jag), men era tips uppskattas ENORMT! :)

    Tack på förhand, och tack igen!

    MVH

    Johan

    EDIT: Coolof, en guide vore läskigt snällt! :)
     
    Last edited: 9 jun 2010
  5. coolof

    coolof Teen Droid Medlem

    Blev medlem:
    30 okt 2009
    Inlägg:
    360
    Mottagna gillanden:
    12

    MINA ENHETER

    Alright, jag är allt annat än en expert på ämnet så om något verkar galet får ni gärna rätta mig. I grund och botten fungerar gradients i xml precis som vilket drawable som helst. Där du vanligtvis hänvisar till en bilds namn hänvisar du istället till en xml. Det är också fritt fram att skapa olika xml:er för olika states (typ normal och pressed) - precis som med bilder med andra ord. Lägg filerna direkt i drawables-mappen.

    Här är en "gradient-xml":
    PHP:
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
            
    android:shape="rectangle">
        
        <
    gradient android:startColor="#e15593"
                  
    android:centerColor="#f9398e"
                  
    android:endColor="#b90d6b"
                  
    android:angle="270"/>
                
        <
    corners android:radius="0dp"/>
        
        <
    stroke android:width="2px" android:color="#000000"/>
        
    </
    shape>
    Gradient sätter såklart gradientens färger. Som jag fattat det kan man sätta tre färger - start, center och end. I det här fallet går den från ljusrosa till mörkrosa med en ganska stark rosa i mitten. Angle sätter din gradients vinkel..

    Corners sätter hur rundade hörn du vill ha. Man kan även sätta varje kant för sig (android:bottomRightRadius="6dip" osv.).

    Och stroke sätter din border, i det här fallet är den satt till 2px vilket gör att den alltid kommer att vara 2px oavsett upplösning på skärmen. Skulle man sätta den till 2dp så skulle den automatiskt skalas beroende på upplösning och därmed alltid se lika bred ut.
     
  6. johle

    johle Kid Droid Medlem

    Blev medlem:
    8 jun 2010
    Inlägg:
    35
    Mottagna gillanden:
    0

    MINA ENHETER

    Wow! Vad kul med ett så snabbt och utförligt svar! :) Jag sitter inte och programmerar på denna dator utan sitter mest och skissar i Photoshop, så jag kan inte testa nu. Jag Googlade dock lite snabbt på Shapes men hittade egentligen inget som låg i linje med denna XML-kod (typ en tutorial med shapes eller liknande). Är det något speciellt man bör tänka på i övrigt när man jobbar med shapes? Jag menar när man lägger in själva Java-koden? :o

    Tack!

    Johan

    EDIT: Drog igång Eclipse nu och testade lite, efter att ha läst igenom ordentligt här så löste det sig! :)
    http://developer.android.com/guide/topics/resources/drawable-resource.html

    Nu ska jag "bara" lyckas rendera dessa gradienter Runtime, men det får bli ett senare problem!

    Stort tack för hjälpen! :D

    Johan
     
    Last edited: 10 jun 2010
  7. ZiP

    ZiP Youth Droid Medlem

    Blev medlem:
    12 feb 2010
    Inlägg:
    126
    Mottagna gillanden:
    0

    MINA ENHETER

  8. sandos

    sandos Adult Droid Medlem

    Blev medlem:
    27 maj 2009
    Inlägg:
    715
    Mottagna gillanden:
    8

    MINA ENHETER

    Ooh, mycket användbart, googlade som sjutton på "selectable" häromdagen men hittade inget. Deras xml-dokumentation är ju generellt riktigt tråkig.