1. Nimm jetzt an unserem Uhans - 3. ADVENT - Gewinnspiel teil - Alle Informationen findest Du hier!

Grafik und Liste

Dieses Thema im Forum "Android App Entwicklung" wurde erstellt von obbi, 16.12.2011.

  1. obbi, 16.12.2011 #1
    obbi

    obbi Threadstarter Neuer Benutzer

    Beiträge:
    3
    Erhaltene Danke:
    0
    Registriert seit:
    15.12.2011
    Hallo zusammen,
    ich möchte in meiner App eine Grafik (Diagramm mit Messwerten) zeichnen und darunter die Liste mit den Messwerten anzeigen. Die Grafik soll im oberen Teil des Bildschirms angezeigt werden, die Liste der Messwerte als zweizeilige Liste darunter. Die Liste muss scrollbar sein, da es relativ viele Einträge sein können. Kriegs aber nicht hin, da ich nicht weiß, welche Elemente ich nehmen soll/muss. Die Grafik alleine zu zeichnen (Bildschirm füllend) ist kein Problem, kann ich mit einem View machen und funktioniert auch. Kann mir jemand sagen, welche Elemente ich verwenden muss, d.h. wie ich das layout gestalten und im xml anordnen muss?
    Herzlichen Dank für Eure Hilfe...
     
  2. swordi, 16.12.2011 #2
    swordi

    swordi Gewerbliches Mitglied

    Beiträge:
    3,389
    Erhaltene Danke:
    441
    Registriert seit:
    09.05.2009
    wo ist das problem jetzt genau?

    machst halt ein linearlayout vertical
    dann die grafik
    dann die liste

    über layout_weight kannst du beiden eine bestimmte aufteilung verpassen und schon sollte es klappen :)
     
  3. obbi, 27.12.2011 #3
    obbi

    obbi Threadstarter Neuer Benutzer

    Beiträge:
    3
    Erhaltene Danke:
    0
    Registriert seit:
    15.12.2011
    Hallo swordi,
    danke für Deine Antwort. Genauso habe ich mir das auch (zumindest theoretisch) gedacht. Jetzt mal zur Praxis...
    Hier ein Auszug aus dem xml, dass die Seite beschreibt:
    Code:
     
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]<[/COLOR][/SIZE]
    [LEFT][/COLOR][/SIZE][SIZE=1][COLOR=#3f7f7f][SIZE=1][COLOR=#3f7f7f]LinearLayout [/COLOR][/SIZE][/COLOR][/SIZE]
    
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]xmlns:android[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"http://schemas.android.com/apk/res/android"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [LEFT][SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:orientation[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"vertical"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_height[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I][SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]>[/COLOR][/SIZE][/COLOR][/SIZE]
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#3f7f7f][SIZE=1][COLOR=#3f7f7f]View [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:id[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"@+id/grafik"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_weight[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"1"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_height[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]/>[/COLOR][/SIZE][/COLOR][/SIZE]
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#3f7f7f][SIZE=1][COLOR=#3f7f7f]ScrollView [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:id[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"@+id/messwerte_scroll"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_weight[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"1"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_height[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"match_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]>[/COLOR][/SIZE][/COLOR][/SIZE]
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#3f7f7f][SIZE=1][COLOR=#3f7f7f]TwoLineListItem[/COLOR][/SIZE][/COLOR][/SIZE]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:id[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"@+id/messwerte_liste"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]xmlns:android[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"http://schemas.android.com/apk/res/android"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"fill_parent"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_height[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"wrap_content"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:minHeight[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"?android:attr/listPreferredItemHeight"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:mode[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"twoLine"[/COLOR][/SIZE][/COLOR][/SIZE][/I][SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]>[/COLOR][/SIZE][/COLOR][/SIZE][/LEFT]
    [/LEFT]
    
     
    
    [LEFT][SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#3f7f7f][SIZE=1][COLOR=#3f7f7f]TextView[/COLOR][/SIZE][/COLOR][/SIZE]
    [LEFT][SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:id[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"@+id/textLfdNr"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"wrap_content"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:layout_height[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"wrap_content"[/COLOR][/SIZE][/COLOR][/SIZE][/I]
    [SIZE=1][COLOR=#7f007f][SIZE=1][COLOR=#7f007f]android:textAppearance[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]=[/SIZE][I][SIZE=1][COLOR=#2a00ff][SIZE=1][COLOR=#2a00ff]"?android:attr/textAppearanceSmall"[/COLOR][/SIZE][/COLOR][/SIZE][/I][/LEFT]
    
    
    [SIZE=1][COLOR=#008080][SIZE=1][COLOR=#008080]/>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008080][/LEFT]
    [/COLOR][/SIZE]
    Zunächst also das vertikale LinearLayout, dann eine View mit Layout_weight 1, gefolgt von einem ScrollView mit layout_weight 1. Die ScrollView beinhaltet dann das TwoLineListItem, dass ich auch in der Activity füllen kann. Was ich schon mal nicht verstehe ist, dass die Liste im TwoLineListItem vertikal bildschirmfüllend angezeigt wird, obwohl die umschließende ScrollView ein layout_weight 1 hat. Könnte daran liegen, dass ich im View noch keine Grafik anzeige, weiß ich aber nicht. Das zweite Problem ist: wie kann ich in die View die Grafik zeichnen? Zum Zeichnen der Grafik benutze ich eine selbst geschriebene Java-Klasse namens Statistics. Hier ein Auszug aus dem Code:​
    Code:
    
    [SIZE=1][COLOR=#7f0055][LEFT][B][SIZE=1][COLOR=#7f0055]public[/COLOR][/SIZE][/B][/COLOR][/SIZE][/LEFT]
    [SIZE=1][COLOR=#7f0055]
     
    [LEFT][/COLOR][/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]class[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=1] Statistics [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]extends[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=1] View [/SIZE]
    [SIZE=1]{[/SIZE]
    
    [SIZE=1][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]public[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=1] Statistics(Context context) [/SIZE][/SIZE][SIZE=1]
    [LEFT][SIZE=1]{[/SIZE]
    [B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]super[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=1](context);[/SIZE]
    [SIZE=1]readExistingMatches();[/SIZE]
    [SIZE=1]}[/SIZE]
    [SIZE=1]...[/SIZE]
    [SIZE=1][SIZE=1][COLOR=#646464][SIZE=1][COLOR=#646464]@Override[/COLOR][/SIZE][/COLOR][/SIZE][/SIZE][SIZE=1]
    [B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]protected[/COLOR][/SIZE][/COLOR][/SIZE][/B][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]void[/COLOR][/SIZE][/COLOR][/SIZE][/B][SIZE=1] onDraw(Canvas canvas) [/SIZE]
    [SIZE=1]{[/SIZE][/SIZE][/SIZE][/LEFT]
    [/LEFT]
    [SIZE=1][SIZE=1]
    [LEFT][SIZE=1]canvas.translate(10, 10);[/SIZE]
    
    [SIZE=1]canvas.drawColor(Color.[/SIZE][I][SIZE=1][COLOR=#0000c0][SIZE=1][COLOR=#0000c0]BLACK[/COLOR][/SIZE][/COLOR][/SIZE][/I][SIZE=1]);[/SIZE]
    
    [/SIZE]...[/SIZE][/LEFT]
    
    Die Methode onDraw benötigt ein Canvas, in das ich dann zeichne. Ich denke, dass sollte dann die View sein, die ich im xml definiert habe. Nur: Woher und wie bekomme ich das?​

    Die Activity, die das Ganze steuert, sieht so aus (Auszug):
    Code:
    [B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]
    [LEFT]public[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]class[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] StatisticsActivity [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]extends[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] ListActivity
    {
    [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]public[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]static[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] ArrayList<MatchHeader> [/SIZE][I][SIZE=1][COLOR=#0000c0][SIZE=1][COLOR=#0000c0]mhList[/I][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1];
    
    [/SIZE][SIZE=1][COLOR=#646464][SIZE=1][COLOR=#646464]@Override[/LEFT]
    [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][LEFT][/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]public[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]void[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] onCreate(Bundle savedInstanceState) 
    {
    [/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]super[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1].onCreate(savedInstanceState);
    // lesen der Daten und Anzeige in der Liste
    readExistingMatches();
    setListAdapter([/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]new[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1] ComplexRowAdapter2([/SIZE][B][SIZE=1][COLOR=#7f0055][SIZE=1][COLOR=#7f0055]this[/B][/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]));
    // Zeichnen der Grafik
    ???[/SIZE]
    [SIZE=1][COLOR=#3f7f5f][SIZE=1][COLOR=#3f7f5f][/LEFT]
    [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][LEFT]
    }[/LEFT]
    [/SIZE]
    Hm, könnte ein bisschen viel Code sein, weiß aber nicht, wie ich das sonst vernünftig erklären soll...

    Gruß obbi​
     
  4. obbi, 11.01.2012 #4
    obbi

    obbi Threadstarter Neuer Benutzer

    Beiträge:
    3
    Erhaltene Danke:
    0
    Registriert seit:
    15.12.2011
    Hallo nochmal,
    hat keiner eine Antwort auf meine Frage?

    Die Frage ist vielleicht im Wust der Information untergegangen. Ich stelle sie nochmal in der Hoffnung auf eine Antwort:

    Woher bekomme ich das Canvas für die OnDraw-Methode bzw. wie starte ich das Zeichnen in der StatisticsActivity (siehe Listing im vorherigen Post)?
     
  5. strider, 11.01.2012 #5
    strider

    strider Erfahrener Benutzer

    Beiträge:
    208
    Erhaltene Danke:
    45
    Registriert seit:
    30.09.2011
    Phone:
    Nexus S
    Über das Canvas musst du dir keine Gedanken machen. Die Funktion rufst du nämlich nur indirekt über view.invalidate() oder gar nicht auf (macht das System wenn es das für nötig hält).
     

Diese Seite empfehlen