{"id":1401,"date":"2016-02-06T11:20:56","date_gmt":"2016-02-06T11:20:56","guid":{"rendered":"http:\/\/www.mplx.de\/Fremdgesteuert\/?p=1401"},"modified":"2019-09-04T04:43:34","modified_gmt":"2019-09-04T04:43:34","slug":"listlayouts-for-android-apps","status":"publish","type":"post","link":"http:\/\/www.mplx.de\/Fremdgesteuert\/2016\/02\/06\/listlayouts-for-android-apps\/","title":{"rendered":"ListLayouts for Android Apps"},"content":{"rendered":"
\"ListView<\/a>

ListView containing icons, images and text<\/p><\/div>\n

Since the ‘Fitness Manager’ App is an app for organizing and scheduling the personal workout, I needed to implement powerful ListViews, which provide the user with helpful information and statues. Still the ListViews must be kept clear. And that is the way how I put my requirements into Java code:<\/p>\n

    \n
  1. \n

    The layout.xml of the activity containing the ListView is very simple.<\/p>\n

  2. \n

    In order to realize my design concept for the ListView, I had to insert a layout.xml and a Java class file, where I did define the elements of the single list items of the ListView.<\/p>\n

    \"Layout<\/a>

    Layout definition of ListView item<\/p><\/div>\n

    As displayed in the code snippet of the layout.xml I did use a RelativeLayout with an id and a background image. On the left side of the parent layout I did insert an ImageView. To the right side of the ImageView I did define two TextViews with different text styles. On the right side of the parent layout I did add another ImageView. The values of all elements in the ListView items are dynamic except of the last ImageView. The source for this ImageView is already set in the layout.xml and received from the rescources.<\/p>\n

    In the Android Studio Designer the XML layout definition of the ListView items is finally displayed like this:<\/p>\n

    \"Layout<\/a>

    Layout definition of ListView item displayed in Android Studio designer<\/p><\/div>\n

    The Java class for a ListView item contains variables, constructors, getter and setter functions for the dynamic elements. Whatever is needed for the ListView item.<\/p>\n

    \"Java<\/a>

    Java class for ListView item definition<\/p><\/div><\/li>\n<\/ol>\n

      \n
    1. \n

      In Android every ListView needs an adapter. If you just want to display a simple ListView with ListView items only containing one simple String value, you just need to define a simple ArrayAdapter in the onCreate<\/em> function of your activity. But if you want to use your own design for the items of the ListView, you also have to define a separate adapter in a Java class file extending the class ArrayAdapter.<\/p>\n

      \"Definition<\/a>

      Definition of adapter for ListView<\/p><\/div>\n

      The adapter class needs to contain a constructor and the methods getItemId<\/em> and getView<\/em>. In the getView<\/em> funtion the elements of the ListView item with dynamic values are set. First an LayoutInflater must be created in order to get the view. The values for the ListView elements are retrieved from the ArrayList and assigned to the ImageView and TextViews by using the corresponding setter functions of the Java class for the ListView elements.<\/p>\n<\/li>\n<\/ol>\n

        \n
      1. \n

        At least the ListView and the adapter have to be instantiated and assigned in the onCreate<\/em> function of the activiy.<\/p>\n

        \"Initialization<\/a>

        Initialization of ListView and corresponding adapter<\/p><\/div>\n

        After initializing the ListView, an ArrayList is defined and filled with the required data and bitmaps in a for loop. Then the adapter has to be defined and assigned to ListView, which then gets registered the context menu. The implementation of the function setOnItemClickListener<\/em> of the ListView needs to be handled in the onCreate<\/em> method of the activity as well.<\/p>\n<\/li>\n<\/ol>\n

          \n
        1. \n

          Most often the appearance of the ListView changes while the activity is running. There are several examples like a new element is added to the ListView, an existing element of the ListView is deleted or a text in one of the TextViews can be changed by another foreground activiy. Then the ListView must be reloaded. This is handled in the onResume<\/em> function of the activiy.<\/p>\n

          \"Reload<\/a>

          Reload of ListView and corresponding adapter<\/p><\/div>\n

          The implementation of the onResume<\/em> method of the activity is similar to the implementation of the onCreate<\/em> function. The ArrayList is defined and filled with the required data and bitmaps again. The global variables of the ListView and the adapter are not defined again here, instead the adapter is cleared and the elements of the ListView are added one by one. The call of the function notifyDataSetChanged<\/em> at the end notifies the attached observers that the underlying data has been changed and any view reflecting data set should refresh itself.<\/p>\n<\/li>\n<\/ol>\n

          This kind of ListView designs can of course also be used for other types of ListViews like the ExpandableListView.<\/p>\n

          \"ExpandableListView\"<\/a>

          ExpandableListView<\/p><\/div>\n

          I hope you did enjoy reading my Blog about the implementation of ListView Layouts for Android devices.<\/p>\n

          If you have any questions, any improvement suggestions for the implementation (I mentioned that this is my first Android App) or any improvement suggestions for my English, I really would appreciate if you can leave me a comment.<\/p>\n

          And I would even more appreciate if you like to check out the ‘Fitness Manager’ App in the Google Play Store<\/a> or the ‘Fitness Manager’ App in the iTunes Store<\/a>. See you.<\/p>\n

          Follow us on
          \n          Facebook<\/a>
          \n          Twitter<\/a>
          \n          Google Plus<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

          Since the ‘Fitness Manager’ App is an app for organizing and scheduling the personal workout, I needed to implement powerful ListViews, which provide the user with helpful information and statues. Still the ListViews must be kept clear. And that is the way how I put my requirements into Java code: The layout.xml of the activity […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[392],"tags":[394,418,415,413,417,416,395,414,404,393,405],"class_list":["post-1401","post","type-post","status-publish","format-standard","hentry","category-android-app-development","tag-android","tag-android-expandablelistview","tag-android-imageview","tag-android-listview","tag-android-listview-icon","tag-android-listview-image","tag-android-studio","tag-android-textview","tag-app","tag-fitness-manager","tag-java"],"_links":{"self":[{"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/posts\/1401","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/comments?post=1401"}],"version-history":[{"count":10,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/posts\/1401\/revisions"}],"predecessor-version":[{"id":1495,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/posts\/1401\/revisions\/1495"}],"wp:attachment":[{"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/media?parent=1401"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/categories?post=1401"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.mplx.de\/Fremdgesteuert\/wp-json\/wp\/v2\/tags?post=1401"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}