android display and windy weather Font Icon

androud studio 3.5.2

Example file: Weathervolleyjson

Not to mention here about json data acquisition and analysis, but read my previous articles with interest.

Not to mention the benefits of font icons, there are a lot of them on the Internet. The app I made can already get and analyze the wind and weather, but the weather has been without icons and it feels uncomfortable, so I go online and browse, usually in two ways, pictures and icon fonts, pictures will be used, but it feels troublesome, icon fonts have not been played with, research.

Hefei has its own icon font. Download Connection: https://github.com/qwd/Icons/releases/tag/v1.1.0

There are svg icons and ttf, woff, woff2 fonts. I only need TTF fonts. So study this. Here are the detailed steps.

The downloaded icon fonts are under the icon folder, remember.

1. Open or create a new android studio project. And switch to the project view (let's not say how to create a new one.)

2. Under the src folder, right-click the main folder--new--folder--Assets Folder. Assets is the font folder.

Then pop up the window below, regardless of it, just finish it.

An Assets folder will appear. I already have fonts in this screenshot folder, so there is a drop-down triangle on the left. Without fonts, there would be no triangle.

3. Put the font file qweather-icons that you just downloaded. Ttf, copy to this folder. The path is usually: \Android Studio Projects\Weathervolleyjson\app\src\mainassets, \app\src\mainassets This may not be the same path you used to on your computer. Find the project file yourself. The same after.

4. Add a TextView control to the layout. What's the size, color, or whatever you like?

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="40dp"
    android:textSize="80dp"
    android:textColor="@color/colorAccent"
    android:text="TextView" />

5. Load icon fonts. Inside onCreate, add the following code after loading the control (such as TextView or whatever) (note that after, not before).

Typeface font = Typeface. CreateFromAsset (getAssets(),'qweather-icons.ttf'); // Load icon fonts
 textView.setTypeface(font);// Set the textView to use icon fonts.

I don't know how to use that Typeface, but I learned it from others anyway. I don't know how to use it. In fact, there are several ways to use icon fonts, which are similar but different. I think this method is simple and direct, and easy to understand.

6. Set the icon font.

Because of the code used for calming the wind, such as iconday in json on sunny days, code 100, and iconday value in cloudy days, 101, see the following figure:

I'm going to spit a little. It's too unprofessional and disrespectful. A font icon is a mess. English-Chinese does not correspond, the code corresponds to English only, does not correspond to Chinese, and each file is not placed in one place, you should find it yourself. Most importantly, the icons are not consistent everywhere, only the code in Chinese has no icons. It's entirely up to you to do your own research. In fact, a table does things without care, like the table below me is not finished?

I didn't do it all, I only did it during the day and not at night. It's really cumbersome to check. You have to look at three or four files at the same time. There are 54 kinds of weather here, basically all day long. After spitting, continue.

In the Hefeng json file is the code, but in the font file is not the code, how other programs do not know, but it is more troublesome in android. Two data will be used. Code, and character code. Code is 100, 101, etc. Character code should be checked in the Term Sheet software (included in the windows attachment). Each icon has a character code. See the following picture:

Install the icon font into windows, find the font in the software, click the icon again, the character code will be shown below. Because I have to use this character code to display this method, I have to look for it one by one.

The following parses the iconday code in json parsing.

String iconday=jsonObject.getString("iconDay");

The parsed data is character type, note that the "iconDay" of the backend must be exactly the same as inside the json file. Otherwise, if I don't parse it, I just made this mistake. D is not capitalized, and it took me several hours to find out why.

Then there is the key code for the display icon:

textView.setText(Html.fromHtml("&#xF101;"));

I don't know what to call ("") This must be done here, preceded by &#x, followed by; (semicolon), and someone wrote strings.xml file, I think it's troublesome, so let's go, understand.

Then there is a lot of judgment, which is certainly simplifiable. I am too lazy to think about it. This method is copy and paste. It is also simple. A total of 54 judgements were made. It's just the font code that displays the icon according to the code.

if (iconday.equals("100")){
                textView.setText(Html.fromHtml("&#xF101;"));
            }else if(iconday.equals("101")){
                textView.setText(Html.fromHtml("&#xF102;"));
            }else if(iconday.equals("102")) {
                textView.setText(Html.fromHtml("&#xF103;"));
            }else if(iconday.equals("103")) {
                textView.setText(Html.fromHtml("&#xF104;"));
            }else if(iconday.equals("104")) {
                textView.setText(Html.fromHtml("&#xF105;"));
            }else if(iconday.equals("300")) {
                textView.setText(Html.fromHtml("&#xF10A;"));
            }else if(iconday.equals("301")) {
                textView.setText(Html.fromHtml("&#xF10B;"));
            }else if(iconday.equals("302")) {
                textView.setText(Html.fromHtml("&#xF10C;"));
            }else if(iconday.equals("303")) {
                textView.setText(Html.fromHtml("&#xF10D;"));
            }else if(iconday.equals("304")) {
                textView.setText(Html.fromHtml("&#xF10E;"));
            }else if(iconday.equals("305")) {
                textView.setText(Html.fromHtml("&#xF10F;"));
            }else if(iconday.equals("306")) {
                textView.setText(Html.fromHtml("&#xF110;"));
            }else if(iconday.equals("307")) {
                textView.setText(Html.fromHtml("&#xF111;"));
            }else if(iconday.equals("308")) {
                textView.setText(Html.fromHtml("&#xF112;"));
            }else if(iconday.equals("309")) {
                textView.setText(Html.fromHtml("&#xF113;"));
            }else if(iconday.equals("310")) {
                textView.setText(Html.fromHtml("&#xF114;"));
            }else if(iconday.equals("311")) {
                textView.setText(Html.fromHtml("&#xF115;"));
            }else if(iconday.equals("312")) {
                textView.setText(Html.fromHtml("&#xF116;"));
            }else if(iconday.equals("313")) {
                textView.setText(Html.fromHtml("&#xF117;"));
            }else if(iconday.equals("314")) {
                textView.setText(Html.fromHtml("&#xF118;"));
            }else if(iconday.equals("315")) {
                textView.setText(Html.fromHtml("&#xF119;"));
            }else if(iconday.equals("316")) {
                textView.setText(Html.fromHtml("&#xF11A;"));
            }else if(iconday.equals("317")) {
                textView.setText(Html.fromHtml("&#xF11B;"));
            }else if(iconday.equals("318")) {
                textView.setText(Html.fromHtml("&#xF11C;"));
            }else if(iconday.equals("399")) {
                textView.setText(Html.fromHtml("&#xF11F;"));
            }else if(iconday.equals("400")) {
                textView.setText(Html.fromHtml("&#xF120;"));
            }else if(iconday.equals("401")) {
                textView.setText(Html.fromHtml("&#xF121;"));
            }else if(iconday.equals("402")) {
                textView.setText(Html.fromHtml("&#xF122;"));
            }else if(iconday.equals("403")) {
                textView.setText(Html.fromHtml("&#xF123;"));
            }else if(iconday.equals("404")) {
                textView.setText(Html.fromHtml("&#xF124;"));
            }else if(iconday.equals("405")) {
                textView.setText(Html.fromHtml("&#xF125;"));
            }else if(iconday.equals("406")) {
                textView.setText(Html.fromHtml("&#xF126;"));
            }else if(iconday.equals("407")) {
                textView.setText(Html.fromHtml("&#xF127;"));
            }else if(iconday.equals("408")) {
                textView.setText(Html.fromHtml("&#xF128;"));
            }else if(iconday.equals("409")) {
                textView.setText(Html.fromHtml("&#xF129;"));
            }else if(iconday.equals("410")) {
                textView.setText(Html.fromHtml("&#xF12A;"));
            }else if(iconday.equals("499")) {
                textView.setText(Html.fromHtml("&#xF12D;"));
            }else if(iconday.equals("500")) {
                textView.setText(Html.fromHtml("&#xF12E;"));
            }else if(iconday.equals("501")) {
                textView.setText(Html.fromHtml("&#xF12F;"));
            }else if(iconday.equals("502")) {
                textView.setText(Html.fromHtml("&#xF130;"));
            }else if(iconday.equals("503")) {
                textView.setText(Html.fromHtml("&#xF131;"));
            }else if(iconday.equals("504")) {
                textView.setText(Html.fromHtml("&#xF132;"));
            }else if(iconday.equals("507")) {
                textView.setText(Html.fromHtml("&#xF133;"));
            }else if(iconday.equals("508")) {
                textView.setText(Html.fromHtml("&#xF134;"));
            }else if(iconday.equals("509")) {
                textView.setText(Html.fromHtml("&#xF135;"));
            }else if(iconday.equals("510")) {
                textView.setText(Html.fromHtml("&#xF136;"));
            }else if(iconday.equals("511")) {
                textView.setText(Html.fromHtml("&#xF137;"));
            }else if(iconday.equals("512")) {
                textView.setText(Html.fromHtml("&#xF138;"));
            }else if(iconday.equals("513")) {
                textView.setText(Html.fromHtml("&#xF139;"));
            }else if(iconday.equals("514")) {
                textView.setText(Html.fromHtml("&#xF13A;"));
            }else if(iconday.equals("515")) {
                textView.setText(Html.fromHtml("&#xF13B;"));
            }else if(iconday.equals("900")) {
                textView.setText(Html.fromHtml("&#xF144;"));
            }else if(iconday.equals("901")) {
                textView.setText(Html.fromHtml("&#xF145;"));
            }else{
                textView.setText(Html.fromHtml("&#xF146;"));
            }

Here is the full code:

xml file:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    android:orientation="vertical"
    tools:context=".MainActivity">


    <!-- This FrameLayout insets its children based on system windows using
         android:fitsSystemWindows. -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="150dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="26 day"
            android:textColor="#FFFFFF"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="27 day"
            android:textColor="#FFFFFF"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="28 day"
            android:textColor="#FFFFFF"
            android:textSize="30dp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="180dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Light rain 23-26℃"
            android:textColor="#FFEB3B"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Light rain 23-26℃"
            android:textColor="#FFEB3B"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Light rain 23-26℃"
            android:textColor="#FFEB3B"
            android:textSize="30dp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="210dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Northwest Wind 2-3 level"
            android:textColor="#FF9800"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Northwest Wind 2-3 level"
            android:textColor="#FF9800"
            android:textSize="30dp" />

        <TextView
            android:id="@+id/textView9"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="Northwest Wind 2-3 level"
            android:textColor="#FF9800"
            android:textSize="30dp" />
    </LinearLayout>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="40dp"
        android:textSize="80dp"
        android:textColor="@color/colorAccent"
        android:text="TextView" />


</RelativeLayout>

java file: (Hefeng key has been removed, fill in your own to function properly)

package com.example.weathervolleyjson;


import android.graphics.Typeface;
import android.os.Bundle;
import android.text.Html;
import android.widget.TextView;

import androidx.appcompat.app.AppCompatActivity;

import com.android.volley.Request;
import com.android.volley.RequestQueue;
import com.android.volley.Response;
import com.android.volley.VolleyError;
import com.android.volley.toolbox.StringRequest;
import com.android.volley.toolbox.Volley;

import org.json.JSONArray;
import org.json.JSONObject;

public class MainActivity extends AppCompatActivity {
    private TextView textView;
    private TextView textView1;
    private TextView textView2;
    private TextView textView3;
    private TextView textView4;
    private TextView textView5;
    private TextView textView6;
    private TextView textView7;
    private TextView textView8;
    private TextView textView9;



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initview();
        Typeface font = Typeface.createFromAsset(getAssets(), "qweather-icons.ttf");
        textView.setTypeface(font);
        getjson();
    }
    public void initview()//Writing all the logic of the controls that need to be initialized here is a good programming paradigm
    {
        textView=findViewById(R.id.textView);
        textView1=findViewById(R.id.textView1);
        textView2=findViewById(R.id.textView2);
        textView3=findViewById(R.id.textView3);
        textView4=findViewById(R.id.textView4);
        textView5=findViewById(R.id.textView5);
        textView6=findViewById(R.id.textView6);
        textView7=findViewById(R.id.textView7);
        textView8=findViewById(R.id.textView8);
        textView9=findViewById(R.id.textView9);
    }
    public void getjson()
    {
        //1. Get json data
        //Create a request queue
        RequestQueue requestQueue=Volley.newRequestQueue(MainActivity.this);
        //Create a request
        String url="https://Devapi. Qweather. Com/v7/weather/3d? Lang=zh&location=101280603&key=and wind key position gzip=n ";
        StringRequest stringRequest=new StringRequest(Request.Method.GET,url, new Response.Listener<String>() {
            //Callbacks after correct acceptance of data
            @Override
            public void onResponse(String response) {
                analyzeJSONArray(response);//Parsing response JSON data
                System.out.println("Successful data acquisition"+response);
            }
        }, new Response.ErrorListener() {//Listening callback after an exception occurs
            @Override
            public void onErrorResponse(VolleyError error) {
                textView1.setText("Load Error"+error);
            }
        });
        //Add the created request to the request queue
        requestQueue.add(stringRequest);
    }
    //2. Parsing json data
    public void analyzeJSONArray(String json) {

        try{
            /**
             * JSON Arrays are bullish, once you have a tag like key person, you have to be a JSON object first
             * Outermost JSON object, which {...} is the largest
             */
            JSONObject jsonObjectALL = new JSONObject(json);

            // Get the JSON array by identifying (person)
            JSONArray jsonArray = jsonObjectALL.getJSONArray("daily");

            JSONObject jsonObject = jsonArray.getJSONObject(0);
            String iconday=jsonObject.getString("iconDay");
            String date = jsonObject.getString("fxDate");
            String subdate= date.substring(date.length()-2);
            String tianqi=jsonObject.getString("textDay");
            String qiwenmax=jsonObject.getString("tempMax");
            String qiwenmin=jsonObject.getString("tempMin");
            String fengxiang = jsonObject.getString("windDirDay");
            String fengli= jsonObject.getString("windScaleDay");
            textView1.setText(subdate+"day");
            textView2.setText(tianqi+"  "+qiwenmin+"-"+qiwenmax+"℃");
            textView3.setText(fengxiang+"  "+fengli+"level");

            if (iconday.equals("100")){
                textView.setText(Html.fromHtml("&#xF101;"));
            }else if(iconday.equals("101")){
                textView.setText(Html.fromHtml("&#xF102;"));
            }else if(iconday.equals("102")) {
                textView.setText(Html.fromHtml("&#xF103;"));
            }else if(iconday.equals("103")) {
                textView.setText(Html.fromHtml("&#xF104;"));
            }else if(iconday.equals("104")) {
                textView.setText(Html.fromHtml("&#xF105;"));
            }else if(iconday.equals("300")) {
                textView.setText(Html.fromHtml("&#xF10A;"));
            }else if(iconday.equals("301")) {
                textView.setText(Html.fromHtml("&#xF10B;"));
            }else if(iconday.equals("302")) {
                textView.setText(Html.fromHtml("&#xF10C;"));
            }else if(iconday.equals("303")) {
                textView.setText(Html.fromHtml("&#xF10D;"));
            }else if(iconday.equals("304")) {
                textView.setText(Html.fromHtml("&#xF10E;"));
            }else if(iconday.equals("305")) {
                textView.setText(Html.fromHtml("&#xF10F;"));
            }else if(iconday.equals("306")) {
                textView.setText(Html.fromHtml("&#xF110;"));
            }else if(iconday.equals("307")) {
                textView.setText(Html.fromHtml("&#xF111;"));
            }else if(iconday.equals("308")) {
                textView.setText(Html.fromHtml("&#xF112;"));
            }else if(iconday.equals("309")) {
                textView.setText(Html.fromHtml("&#xF113;"));
            }else if(iconday.equals("310")) {
                textView.setText(Html.fromHtml("&#xF114;"));
            }else if(iconday.equals("311")) {
                textView.setText(Html.fromHtml("&#xF115;"));
            }else if(iconday.equals("312")) {
                textView.setText(Html.fromHtml("&#xF116;"));
            }else if(iconday.equals("313")) {
                textView.setText(Html.fromHtml("&#xF117;"));
            }else if(iconday.equals("314")) {
                textView.setText(Html.fromHtml("&#xF118;"));
            }else if(iconday.equals("315")) {
                textView.setText(Html.fromHtml("&#xF119;"));
            }else if(iconday.equals("316")) {
                textView.setText(Html.fromHtml("&#xF11A;"));
            }else if(iconday.equals("317")) {
                textView.setText(Html.fromHtml("&#xF11B;"));
            }else if(iconday.equals("318")) {
                textView.setText(Html.fromHtml("&#xF11C;"));
            }else if(iconday.equals("399")) {
                textView.setText(Html.fromHtml("&#xF11F;"));
            }else if(iconday.equals("400")) {
                textView.setText(Html.fromHtml("&#xF120;"));
            }else if(iconday.equals("401")) {
                textView.setText(Html.fromHtml("&#xF121;"));
            }else if(iconday.equals("402")) {
                textView.setText(Html.fromHtml("&#xF122;"));
            }else if(iconday.equals("403")) {
                textView.setText(Html.fromHtml("&#xF123;"));
            }else if(iconday.equals("404")) {
                textView.setText(Html.fromHtml("&#xF124;"));
            }else if(iconday.equals("405")) {
                textView.setText(Html.fromHtml("&#xF125;"));
            }else if(iconday.equals("406")) {
                textView.setText(Html.fromHtml("&#xF126;"));
            }else if(iconday.equals("407")) {
                textView.setText(Html.fromHtml("&#xF127;"));
            }else if(iconday.equals("408")) {
                textView.setText(Html.fromHtml("&#xF128;"));
            }else if(iconday.equals("409")) {
                textView.setText(Html.fromHtml("&#xF129;"));
            }else if(iconday.equals("410")) {
                textView.setText(Html.fromHtml("&#xF12A;"));
            }else if(iconday.equals("499")) {
                textView.setText(Html.fromHtml("&#xF12D;"));
            }else if(iconday.equals("500")) {
                textView.setText(Html.fromHtml("&#xF12E;"));
            }else if(iconday.equals("501")) {
                textView.setText(Html.fromHtml("&#xF12F;"));
            }else if(iconday.equals("502")) {
                textView.setText(Html.fromHtml("&#xF130;"));
            }else if(iconday.equals("503")) {
                textView.setText(Html.fromHtml("&#xF131;"));
            }else if(iconday.equals("504")) {
                textView.setText(Html.fromHtml("&#xF132;"));
            }else if(iconday.equals("507")) {
                textView.setText(Html.fromHtml("&#xF133;"));
            }else if(iconday.equals("508")) {
                textView.setText(Html.fromHtml("&#xF134;"));
            }else if(iconday.equals("509")) {
                textView.setText(Html.fromHtml("&#xF135;"));
            }else if(iconday.equals("510")) {
                textView.setText(Html.fromHtml("&#xF136;"));
            }else if(iconday.equals("511")) {
                textView.setText(Html.fromHtml("&#xF137;"));
            }else if(iconday.equals("512")) {
                textView.setText(Html.fromHtml("&#xF138;"));
            }else if(iconday.equals("513")) {
                textView.setText(Html.fromHtml("&#xF139;"));
            }else if(iconday.equals("514")) {
                textView.setText(Html.fromHtml("&#xF13A;"));
            }else if(iconday.equals("515")) {
                textView.setText(Html.fromHtml("&#xF13B;"));
            }else if(iconday.equals("900")) {
                textView.setText(Html.fromHtml("&#xF144;"));
            }else if(iconday.equals("901")) {
                textView.setText(Html.fromHtml("&#xF145;"));
            }else{
                textView.setText(Html.fromHtml("&#xF146;"));
            }

            JSONObject jsonObject1 = jsonArray.getJSONObject(1);
            String date2 = jsonObject1.getString("fxDate");
            String subdate2= date2.substring(date2.length()-2);
            String tianqi2=jsonObject1.getString("textDay");
            String qiwenmax2=jsonObject1.getString("tempMax");
            String qiwenmin2=jsonObject1.getString("tempMin");
            String fengxiang2 = jsonObject1.getString("windDirDay");
            String fengli2= jsonObject1.getString("windScaleDay");
            textView4.setText(subdate2+"day");
            textView5.setText(tianqi2+"  "+qiwenmin2+"-"+qiwenmax2+"℃");
            textView6.setText(fengxiang2+"  "+fengli2+"level");

            JSONObject jsonObject2 = jsonArray.getJSONObject(2);
            String date3 = jsonObject2.getString("fxDate");
            String subdate3= date3.substring(date3.length()-2);
            String tianqi3=jsonObject2.getString("textDay");
            String qiwenmax3=jsonObject2.getString("tempMax");
            String qiwenmin3=jsonObject2.getString("tempMin");
            String fengxiang3 = jsonObject2.getString("windDirDay");
            String fengli3= jsonObject2.getString("windScaleDay");
            textView7.setText(subdate3+"day");
            textView8.setText(tianqi3+"  "+qiwenmin3+"-"+qiwenmax3+"℃");
            textView9.setText(fengxiang3+"  "+fengli3+"level");
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}

Actually, I thought it would be OK for json to parse twice, then parse the English version again, and then pick up the weather in English, so there would be less judgment. I don't know if it's OK or not, even though it's not a standard, I haven't tried it anyway. In this way, using weather code directly will never go wrong, it's just too ugly.

Finally, the results are displayed:

Finally, let's show what I've done with my desktop mobile phone. I just made a horizontal layout, but I haven't done it yet. This period is not empty. Please come back after June. I don't know how much I can remember by then.

 

Keywords: Java Android Android Studio JSON

Added by f1r3fl3x on Sun, 09 Jan 2022 19:33:52 +0200