This article shares the specific code of WheelView to implement up and down slide selector for your reference. The specific content is as follows
1. Obtain wheel
wheel is an open source control on GitHub. We can download it directly on GitHub./maarek/android-wheelAfter the download is completed, we can use the wheel file inside as a library, or copy the Java class and xml files inside the wheel to our project for use.
2. How to use
First, let’s take a look at the main layout file:
<RelativeLayout xmlns:andro xmlns:tools="/tools" android:layout_width="match_parent" android:layout_height="match_parent" > <TextView android: android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:text="Please select a city" /> <LinearLayout android: android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/title" android:background="@drawable/layout_bg" android:orientation="horizontal" > < android: android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" > </> < android: android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" > </> < android: android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" > </> </LinearLayout> <Button android: android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/content" android:onClick="onClick" android:text="Sure" /> </RelativeLayout>
OK, in the main layout file, we use three WheelViews, respectively, to represent provinces, cities and counties. In MainActivity, we must first get these three controls:
provinceView = (WheelView) (.province_view); cityView = (WheelView) (.city_view); areaView = (WheelView) (.area_view);
After getting it, we need to use the ArrayWheelAdapter data adapter to adapt data. There are two parameters here, one is the context and the other is an array. This array is what we want to display, that is, we need to save provinces, cities, and districts as arrays. However, considering that a province corresponds to multiple cities and a city corresponds to multiple districts and counties, in order to correlate provinces, cities and counties, we also need to use a Map collection. Therefore, the data structure we designed is as follows:
/** * Province */ private String[] provinceArray; /** * Province-City */ private Map<String, String[]> citiesMap; /** * City-district and county */ private Map<String, String[]> areasMap;
The first array stores the data of all provinces, the second map stores the data of all provinces and the third map stores the data of all districts and counties corresponding to all cities. We now want to assign values to these three data sets. Let’s first look at our json data format:
[{"name":"Beijing","city":[{"name":"Beijing","area":["Dongcheng District","Xicheng District","Chongwen District","Xuanwu District"...]}]}......]
Our json data is in this format. The json data is present in the assets folder. Let’s see how to parse json data and assign it to the above three data sets:
private void initJson() { citiesMap = new HashMap<String, String[]>(); areasMap = new HashMap<String, String[]>(); InputStream is = null; try { StringBuffer sb = new StringBuffer(); is = getAssets().open(""); int len = -1; byte[] buf = new byte[1024]; while ((len = (buf)) != -1) { (new String(buf, 0, len, "gbk")); } JSONArray ja = new JSONArray(()); provinceArray = new String[()]; String[] citiesArr = null; for (int i = 0; i < ; i++) { JSONObject jsonProvince = (i); provinceArray[i] = ("name"); JSONArray jsonCities = ("city"); citiesArr = new String[()]; for (int j = 0; j < ; j++) { JSONObject jsonCity = (j); citiesArr[j] = ("name"); JSONArray jsonAreas = ("area"); String[] areaArr = new String[()]; for (int k = 0; k < (); k++) { areaArr[k] = (k); } (citiesArr[j], areaArr); } (provinceArray[i], citiesArr); } } catch (IOException e) { (); } catch (JSONException e) { (); } finally { if (is != null) { try { (); } catch (IOException e) { (); } } } }
There is no difficulty in json parsing technology. The logic here is a bit complicated. Three nested for loops are used. It is not difficult for you to think about it slowly. OK, when there is data in the dataset, we can set up Adapters for three wheels:
private void initView() { (new ArrayWheelAdapter<String>( , provinceArray)); // The default displays the cities in Beijing municipalities (only Beijing) (new ArrayWheelAdapter<String>( , ("Beijing"))); // The districts and counties in Beijing are displayed by default (new ArrayWheelAdapter<String>( , ("Beijing"))); // The first item is displayed by default (0); // The first item is displayed by default (0); // The first item is displayed by default (0); // 7 items are displayed on the page (7); (7); (7); // Add a sliding event (this); (this); }
After setting up Adapter, we also set some default values, all of which are very simple. Just look at the comments. We have set two listening events here, let’s take a look:
@Override public void onChanged(WheelView wheel, int oldValue, int newValue) { if (wheel == provinceView) { // When updating provinces, not only the city must be updated, but also the districts and counties must be updated. updateCity(); updateArea(); } else if (wheel == cityView) { // When updating the city, you only need to update the district and county updateArea(); } } private void updateArea() { // Get the subscript of the currently displayed City int cityIndex = (); // Get the subscript of the currently displayed province int provinceIndex = (); // Get the name of the currently displayed province String proviceName = provinceArray[provinceIndex]; // Get the name of the city currently displayed String currentName = (proviceName)[cityIndex]; // Obtain all districts and counties under the city according to the name of the currently displayed city String[] areas = (currentName); // Set the newly obtained data to areaView (new ArrayWheelAdapter<String>( , areas)); // The first item is displayed by default (0); } private void updateCity() { // Get the subscript of the currently displayed province int currentIndex = (); // Get the name of the currently displayed province String currentName = provinceArray[currentIndex]; // Obtain all cities in the province based on the name of the currently displayed province String[] cities = (currentName); // Set the newly obtained data to cityView (new ArrayWheelAdapter<String>( , cities)); // The first item is displayed by default (0); }
Almost every line of code has comments, so I won’t talk about it anymore. Finally, let’s take a look at the click event:
public void onClick(View v) { // Get the subscript of the currently displayed province int provinceIndex = (); // Get the name of the currently displayed province String provinceName = provinceArray[provinceIndex]; // Get the subscript of the currently displayed city int cityIndex = (); // Get the name of the currently displayed city String cityName = (provinceName)[cityIndex]; // Get the subscript of the currently displayed district and county int areaIndex = (); ( this, "The region you choose is" + provinceArray[provinceIndex] + cityName + (cityName)[areaIndex], Toast.LENGTH_SHORT) .show(); }
Okay, the functions we want are basically implemented here, but we can see that the default style of the system is a bit ugly, so we can get the style we want by modifying the source code. First, look at the black edges up and down here:
private int[] SHADOWS_COLORS = new int[] { 0xFF111111, 0x00AAAAAA, 0x00AAAAAA };
In the file, this line of code defines the color changes of the upper and lower black edges. The three parameters are the starting color, the transition color and the end color. Then we can remove the upper and lower black edges by modifying the source code here, and the transparent thing in the middle is black. We want to change it, and we found the file wheel_val.xml through the source code:
<shape xmlns:andro> <gradient android:startColor="#70222222" android:centerColor="#70222222" android:endColor="#70EEEEEE" android:angle="90" /> <stroke android:width="1dp" android:color="#70333333" /> </shape>
Here we define the style of the transparent bar in the middle, which we can modify according to our own needs. Okay, there are not many source codes here, and it is not difficult. You can think about it yourself. We will talk about the introduction to wheel.
Download this article demo/lenve/wheelTest
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.