📜 ⬆️ ⬇️

Change view. Change the look of the interface

Not so long ago, while surfing the Internet, I came across a wonderful site with design patterns for android. Great site - a lot of useful tips on how to make the interface more user-friendly, but there is one big “BUT” that I did not like. Climbing the entire site, I did not find a single reference to the implementation of at least one pattern. And it is not that difficult to think a little and write an application, focusing on this pattern, but much faster, since laziness is more pleasant to see and use the existing one in another way . And for novice android developers, life becomes easier when you can see what you can do and how you can do it. So I decided that it would be nice to write tutorials on these patterns. And we will begin, without claiming to be the ultimate truth, from this , that is, from the very first!



So, we will implement it using LayoutInflater. On the page with the pattern, the file manager with ListView and GridView is shown as an example. Here we use them. Respectively list.xml:
')
<ListView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/listLayout" android:layout_width="fill_parent" android:layout_height="fill_parent" > </ListView> 

and grid.xml (in which we will make 4 columns for greater beauty and set gravity to center):

 <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridLayout" android:layout_width="fill_parent" android:layout_height="fill_parent" android:numColumns="4" android:gravity="center" > </GridView> 


Oh yeah, we will also separately make objects for our View in order to simplify our life as much as possible. So, list_item.xml:

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/linearLayout1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <ImageView android:id="@+id/imageView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_launcher" /> <TextView android:id="@+id/textItem" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Medium Text" android:textAppearance="?android:attr/textAppearanceMedium" /> </LinearLayout> 


and grid_item.xml:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" > <Button android:id="@+id/gridButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Button" android:drawableTop="@drawable/ic_launcher" /> </LinearLayout> 


Well now you can proceed to the Activity (we will not touch main.xml). Since we use design patterns, we try to respect the users of our application, and accordingly we need to remember their choice so that we don’t have to customize the interface with each input. To do this, use SharedPreferences and do two methods:

 private void SavePreferences(String key, String value) { SharedPreferences sharedPreferences = getPreferences(MODE_PRIVATE); SharedPreferences.Editor editor = sharedPreferences.edit(); editor.putString(key, value); editor.commit(); } private String LoadPreferences(String key) { SharedPreferences sharedPreferences = getPreferences(MODE_PRIVATE); String loadedString = sharedPreferences.getString(key, "list"); return loadedString; } 


Now you need to create a ViewGroup that will store our View (and the View itself would be nice to create; you could write Views, but I don’t like it when they translate such terms, so I'd rather write in English). We will not create a separate object for the LayoutInflater, since the documentation on android does not recommend us to do this (based on the fact that in the context of our Activity it has already been created and correctly configured, that is, it only remains to get an instance). Accordingly, we will place such a cat in the onCreate method:

  setContentView(R.layout.main); content = new String[] {"Item 1", "Item 2", "Item 3", "Item 4", "Item 5", "Item 6", "Item 7", "Item 8", "Item 9", "Item 10"}; viewGroup = (ViewGroup) findViewById(R.id.mainLayout); list = getLayoutInflater().inflate(R.layout.list, null); grid = getLayoutInflater().inflate(R.layout.grid, null); if(LoadPreferences("VIEW").equalsIgnoreCase("list")) setList(); else setGrid(); 


Now tell about setList () and setGrid (). Since we will continue to dynamically update our interface, I created separate methods for this:

 private void setList() { viewGroup.removeAllViews(); viewGroup.addView(list); ListView listView = (ListView) list.findViewById(R.id.listLayout); listView.setAdapter(new ArrayAdapter<String>(this, R.layout.list_item, R.id.textItem, content)); } private void setGrid() { viewGroup.removeAllViews(); viewGroup.addView(grid); GridView gridview = (GridView) findViewById(R.id.gridLayout); gridview.setAdapter(new ArrayAdapter<String>(this, R.layout.grid_item, R.id.gridButton, content)); } 


Great! You can try to run the application! It is working! But it would be nice now to add a switch, for which, in fact, the article was written. We will do this through the menu, which is called when you press the hardware button. This will pop up the menu.xml:

 <menu xmlns:android="http://schemas.android.com/apk/res/android" > <item android:id="@+id/item" android:title="Change view"></item> </menu> 


And so the methods for its work in our Activity (both methods return true, instead of performing operations of the superclass, since we defined our interface and set our own actions):

  @Override public boolean onCreateOptionsMenu(Menu menu) { // TODO Auto-generated method stub MenuInflater inflater = getMenuInflater(); inflater.inflate(R.menu.menu, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // TODO Auto-generated method stub if(LoadPreferences("VIEW").equalsIgnoreCase("list")) { setGrid(); SavePreferences("VIEW", "grid"); } else { setList(); SavePreferences("VIEW", "list"); } return true; } 


Well, almost everything. Just in case, lay out the project in the archive . And good luck to novice android developers.

Source: https://habr.com/ru/post/150143/


All Articles