java.lang.NullPointerException : Loading three charts (from github) into a 2x2 GridView

Question

我正在尝试制作一个 2x2 网格，其中前 3 个网格将具有从 GitHub 导入的三个(Thingspeak)图表(https://github.com/MacroYau/ThingSpeakAndroid)and 第四个网格将具有我的相机的实时视频录制(稍后将在 WebView)。

我正在使用 GridView 在 2x2 网格中显示图表，但不知何故，图表的位置不正确，如下所示:

TempHumidity.java:

package com.macroyau.thingspeakandroid.demo;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.GridView;
import android.widget.Toast;
import com.macroyau.thingspeakandroid.ThingSpeakChannel;
import com.macroyau.thingspeakandroid.ThingSpeakLineChart;
import com.macroyau.thingspeakandroid.model.ChannelFeed;
import java.util.Calendar;
import java.util.Date;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.Viewport;
import lecho.lib.hellocharts.view.LineChartView;

公共(public)类 TempHumidity 扩展 AppCompatActivity {

private ThingSpeakChannel tsChannel, tsChannel1, tsChannel2;
private ThingSpeakLineChart tsChart, tsChart1, tsChart2;
private LineChartView chartView, chartView1, chartView2;

GridView simpleGrid;
int charts[] = {R.id.chart, R.id.chart1, R.id.chart2};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    simpleGrid = (GridView) findViewById(R.id.simpleGridView); // init GridView
    // Create an object of CustomAdapter and set Adapter to GirdView
    GridViewAdapter customAdapter = new GridViewAdapter(getApplicationContext(), charts);
    simpleGrid.setAdapter(customAdapter);

    // Connect to ThinkSpeak Channels
    tsChannel = new ThingSpeakChannel(377467);
    tsChannel1 = new ThingSpeakChannel(357670);
    tsChannel2 = new ThingSpeakChannel(377509);
    // Set listener for Channel feed update events
    tsChannel.setChannelFeedUpdateListener(new ThingSpeakChannel.ChannelFeedUpdateListener() {
        @Override
        public void onChannelFeedUpdated(long channelId, String channelName, ChannelFeed channelFeed) {
            // Show Channel ID and name on the Action Bar
            getSupportActionBar().setTitle(channelName);
            getSupportActionBar().setSubtitle("Channel " + channelId);
            // Notify last update time of the Channel feed through a Toast message
            Date lastUpdate = channelFeed.getChannel().getUpdatedAt();
            Toast.makeText(TempHumidity.this, lastUpdate.toString(), Toast.LENGTH_LONG).show();
        }
    });
    // Fetch the specific Channel feed
    tsChannel.loadChannelFeed();

    // Create a Calendar object dated 1 minutes ago
    Calendar calendar = Calendar.getInstance();
    calendar.add(Calendar.MINUTE, -1);

    // Configure LineChartView
    chartView = (LineChartView) findViewById(R.id.chart);
    chartView.setZoomEnabled(false);
    chartView.setValueSelectionEnabled(true);

    // Create a line chart from Field1 of ThinkSpeak Channel 9
    tsChart = new ThingSpeakLineChart(377467, 1);
    // Get 200 entries at maximum
    tsChart.setNumberOfEntries(200);
    // Set value axis labels on 10-unit interval
    tsChart.setValueAxisLabelInterval(10);
    // Set date axis labels on 5-minute interval
    tsChart.setDateAxisLabelInterval(1);
    // Show the line as a cubic spline
    tsChart.useSpline(true);
    // Set the line color
    tsChart.setLineColor(Color.parseColor("#D32F2F"));
    // Set the axis color
    tsChart.setAxisColor(Color.parseColor("#455a64"));
    // Set the starting date (5 minutes ago) for the default viewport of the chart
    tsChart.setChartStartDate(calendar.getTime());
    // Set listener for chart data update
    tsChart.setListener(new ThingSpeakLineChart.ChartDataUpdateListener() {
        @Override
        public void onChartDataUpdated(long channelId, int fieldId, String title, LineChartData lineChartData, Viewport maxViewport, Viewport initialViewport) {
            // Set chart data to the LineChartView
            chartView.setLineChartData(lineChartData);
            // Set scrolling bounds of the chart
            chartView.setMaximumViewport(maxViewport);
            // Set the initial chart bounds
            chartView.setCurrentViewport(initialViewport);
        }
    });
    // Load chart data asynchronously
    tsChart.loadChartData();



    //---------------end of Temp Humidity Channel---------------------//
    //---------------start of Soil Humidity Channel---------------------//

    tsChannel1.setChannelFeedUpdateListener(new ThingSpeakChannel.ChannelFeedUpdateListener() {
        @Override
        public void onChannelFeedUpdated(long channelId, String channelName, ChannelFeed channelFeed) {
            // Show Channel ID and name on the Action Bar
            getSupportActionBar().setTitle(channelName);
            getSupportActionBar().setSubtitle("Channel " + channelId);
            // Notify last update time of the Channel feed through a Toast message
            Date lastUpdate = channelFeed.getChannel().getUpdatedAt();
            Toast.makeText(TempHumidity.this, lastUpdate.toString(), Toast.LENGTH_LONG).show();
        }
    });
    // Fetch the specific Channel feed
    tsChannel1.loadChannelFeed();

    // Create a Calendar object dated 1 minutes ago
    Calendar calendar1 = Calendar.getInstance();
    calendar1.add(Calendar.MINUTE, -1);

    // Configure LineChartView
    chartView1 = (LineChartView) findViewById(R.id.chart1);
    chartView1.setZoomEnabled(false);
    chartView1.setValueSelectionEnabled(true);

    // Create a line chart from Field1 of ThinkSpeak Channel 9
    tsChart1 = new ThingSpeakLineChart(377467, 1);
    // Get 200 entries at maximum
    tsChart1.setNumberOfEntries(200);
    // Set value axis labels on 10-unit interval
    tsChart1.setValueAxisLabelInterval(10);
    // Set date axis labels on 5-minute interval
    tsChart1.setDateAxisLabelInterval(1);
    // Show the line as a cubic spline
    tsChart1.useSpline(true);
    // Set the line color
    tsChart1.setLineColor(Color.parseColor("#D32F2F"));
    // Set the axis color
    tsChart1.setAxisColor(Color.parseColor("#455a64"));
    // Set the starting date (5 minutes ago) for the default viewport of the chart
    tsChart1.setChartStartDate(calendar.getTime());
    // Set listener for chart data update
    tsChart1.setListener(new ThingSpeakLineChart.ChartDataUpdateListener() {
        @Override
        public void onChartDataUpdated(long channelId, int fieldId, String title, LineChartData lineChartData, Viewport maxViewport, Viewport initialViewport) {
            // Set chart data to the LineChartView
            chartView1.setLineChartData(lineChartData);
            // Set scrolling bounds of the chart
            chartView1.setMaximumViewport(maxViewport);
            // Set the initial chart bounds
            chartView1.setCurrentViewport(initialViewport);
        }
    });
    // Load chart data asynchronously
    tsChart1.loadChartData()
  }
}

以上代码适用于 2 个图表，第三个图表已重复相同的代码。

activity_main.xml

android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="1dp">
<!--android:orientation="vertical">-->

<lecho.lib.hellocharts.view.LineChartView
    android:id="@+id/chart"
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:layout_gravity="center_horizontal"
    android:scaleType="fitXY" />

<lecho.lib.hellocharts.view.LineChartView
    android:id="@+id/chart1"
    android:layout_width="200dp"
    android:scaleType="fitXY"
    android:layout_gravity="center_horizontal"
    android:layout_height="200dp"
    />
<lecho.lib.hellocharts.view.LineChartView
    android:id="@+id/chart2"
    android:layout_width="200dp"
    android:scaleType="fitXY"
    android:layout_gravity="center_horizontal"
    android:layout_height="200dp"
    />

gridVewAdapter.java

public class GridViewAdapter extends BaseAdapter {

 private Context context;
 private final int[] charts;
 LayoutInflater inflter;

 public GridViewAdapter(Context Appcontext, int[] charts) {
    this.context = Appcontext;
    this.charts = charts;
    inflter = (LayoutInflater.from(Appcontext));
}

@Override
public View getView(int i, View view, ViewGroup viewGroup) {
    view = inflter.inflate(R.layout.activity_main, null); // inflate the layout
    LineChartView cv = (LineChartView) view.findViewById(R.id.chart); // get the reference of ImageView
    return view;
}


@Override
public int getCount() {
    return charts.length;
}

@Override
public Object getItem(int position) {
    return null;
}

@Override
public long getItemId(int position) {
    return 0;
}

}

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical">
<!--
-->
<GridView
    android:id="@+id/simpleGridView"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:footerDividersEnabled="false"
    android:padding="1dp"
    android:numColumns="2" />
</LinearLayout>

我在 logcat 中收到以下错误:

01-14 17:11:24.784 23142-23142/com.macroyau.thingspeakandroid.demo E/AndroidRuntime: FATAL EXCEPTION: main
 java.lang.RuntimeException: Unable to start activity ComponentInfo{com.macroyau.thingspeakandroid.demo/com.macroyau.thingspeakandroid.demo.TempHumidity}: java.lang.NullPointerException
 at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2245)
 at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2299)
 at android.app.ActivityThread.access$700(ActivityThread.java:150)
 at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1280)
 at android.os.Handler.dispatchMessage(Handler.java:99)
 at android.os.Looper.loop(Looper.java:137)
 at android.app.ActivityThread.main(ActivityThread.java:5283)
 at java.lang.reflect.Method.invokeNative(Native Method)
 at java.lang.reflect.Method.invoke(Method.java:511)
 at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1102)
 at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:869)
    at dalvik.system.NativeStart.main(Native Method)
 Caused by: java.lang.NullPointerException
   at com.macroyau.thingspeakandroid.demo.TempHumidity.onCreate(TempHumidity.java:60)
   at android.app.Activity.performCreate(Activity.java:5283)
   at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1097)
   at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2209)
   at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2299) 
   at android.app.ActivityThread.access$700(ActivityThread.java:150) 
   at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1280) 
   at android.os.Handler.dispatchMessage(Handler.java:99) 
   at android.os.Looper.loop(Looper.java:137) 
   at android.app.ActivityThread.main(ActivityThread.java:5283) 
   at java.lang.reflect.Method.invokeNative(Native Method) 
   at java.lang.reflect.Method.invoke(Method.java:511) 
   at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1102) 
   at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:869) 
   at dalvik.system.NativeStart.main(Native Method) 
01-14 17:11:28.007 23142-23146/com.macroyau.thingspeakandroid.demo D/dalvikvm: GC_CONCURRENT freed 587K, 19% free 8887K/10932K, paused 4ms+22ms, total 114ms

下面是代码:

当我运行代码(按原样)而不在 Gridview 中添加两个图表时，它工作正常，如下所示:

Answer 1

如果您想要 2x2 网格，您也可以使用layout_weight 在 LinearLayout 中实现。当您像上面那样静态指定每个网格项目的宽度时，它可能很容易超出屏幕范围...

将“object”元素替换为您的图表对象。这再次形成了 2x2 网格。

<?xml version="1.0" encoding="utf-8"?>
<!-- Container LinearLayout -->
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <!-- Row 1 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
        <object
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            />
        <object
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            />
    </LinearLayout>

    <!-- Row 2 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
        <object
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            />
        <object
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            />
    </LinearLayout>
</LinearLayout>