android - 包含 TableLayouts 的 fragment 的 ViewPager 加载缓慢 :

Question

我正在开发一个包含 fragment (每次最多 4 个 fragment )的 ViewPager Activity ，每个 fragment 都包含 TableLayout。所以基本上加载了 4 个表。这是将数据加载到 Fragment 的代码，该代码稍后附加到 ViewPager:

 public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) 
{
    if (container == null) {
        return null;
    }

    LinearLayout.LayoutParams layoutParams=new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
    layoutParams.gravity=Gravity.CENTER_VERTICAL;
    layoutParams.setMargins(10, 0, 0, 0);

    fragmetLayout = (LinearLayout)inflater.inflate(R.layout.grid_fragment_layout, container, false);
    table = (TableLayout) fragmetLayout.findViewById(R.id.tlGridTable);
    llParameterContainer =  (LinearLayout) fragmetLayout.findViewById(R.id.llParametersContainer);
    tabName = (TextView) fragmetLayout.findViewById(R.id.tvTabName);
    tabName.setText(tab.getTabName());
    //tabName.setLayoutParams(layoutParams);

    for (Parameter parameter : SGRaportManagerAppObj.getInstance().parametersRepository.getParametersRepository())
    {
        ImageView parameterPoint = new ImageView(getActivity());
        parameterPoint.setImageResource(R.drawable.parameter_chosen_point);
        parameterPoint.setPadding(10, 10, 10, 0);
        parameterPoint.setLayoutParams(layoutParams);
        llParameterContainer.addView(parameterPoint);

        TextView parameterTextView = new TextView(getActivity());
        parameterTextView.setText(parameter.getName()+":");
        parameterTextView.setGravity(Gravity.CENTER);
        parameterTextView.setTextColor(getResources().getColor(R.color.my_black));  
        parameterTextView.setPadding(5, 10, 3, 10);
        parameterTextView.setLayoutParams(layoutParams);
        llParameterContainer.addView(parameterTextView);
        TextView parameterChosenValueTextView = new TextView(getActivity());
        parameterChosenValueTextView.setText(parameter.getChosenValue());
        parameterChosenValueTextView.setGravity(Gravity.CENTER); 
        parameterChosenValueTextView.setPadding(0, 10, 0, 10);
        parameterChosenValueTextView.setLayoutParams(layoutParams);
        parameterChosenValueTextView.setTextColor(getResources().getColor(R.color.my_black));   
        llParameterContainer.addView(parameterChosenValueTextView);

    }
    //table.setStretchAllColumns(true);  
    //table.setShrinkAllColumns(true); 
    TableRow tableRow = new TableRow(getActivity());
    TableLayout.LayoutParams tableRowParams=new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT,TableLayout.LayoutParams.WRAP_CONTENT);
    tableRowParams.setMargins(2, 0, 0, 0);
    tableRow.setLayoutParams(tableRowParams);
    Log.d(TAG, "TAB FROM FRAGMENT:"+tab.toString());


    TableRow.LayoutParams tlparamsFirstColumn = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT); 
    tlparamsFirstColumn.setMargins(4, 0, 2, 0);
    TableRow.LayoutParams tlparams = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT); 
    tlparams.setMargins(0, 0, 2, 0);

    //The First row for the column names.
    for (int i= 0; i < tab.getGrid().getGridColumnsList().size(); i++)
    {
        TextView tvName = new TextView(getActivity());
        String columnName = tab.getGrid().getGridColumnsList().get(i).getGridColumnAlias();
        tvName.setText(columnName);
        Log.d(TAG, "COLUMN ALIAS FROM FRAGMENT: "+columnName);
        if (i == 0)
        {
            tvName.setLayoutParams(tlparamsFirstColumn);
        }
        else
        {
            tvName.setLayoutParams(tlparams);
        }
        tvName.setGravity(Gravity.CENTER);
        tvName.setTextColor(getResources().getColor(R.color.my_white));  
        tvName.setPadding(10, 10, 10, 10);
        tvName.setBackgroundDrawable(getResources().getDrawable(R.drawable.grid_column_name_background));   
        tableRow.addView(tvName);
    }
    table.addView(tableRow);

    for (int j = 0; j < tab.getGrid().getGridData().getNumRows(); j++)
    {
        TableRow newRow = new TableRow(getActivity());
        TableLayout.LayoutParams insideRowParams=new TableLayout.LayoutParams(TableLayout.LayoutParams.WRAP_CONTENT,TableLayout.LayoutParams.WRAP_CONTENT);
        tableRowParams.setMargins(0, 2, 0, 0);
        for (int k = 0; k < tab.getGrid().getGridData().getNumCols(j); k++)
        {
            TextView tvName = new TextView(getActivity());
            String columnName = tab.getGrid().getGridData().get(j, k);
            tvName.setText(columnName);

            if ( (j % 2) == 0)
            {
                tvName.setBackgroundDrawable(getResources().getDrawable(R.drawable.grid_first_row_background)); 
            }
            else
            {
                tvName.setBackgroundDrawable(getResources().getDrawable(R.drawable.grid_second_row_background));    
            }
            if (k == 0)
            {
                tvName.setLayoutParams(tlparamsFirstColumn);
            }
            else
            {
                tvName.setLayoutParams(tlparams);
            }
            tvName.setGravity(Gravity.CENTER);
            tvName.setTextColor(getResources().getColor(R.color.my_black));  
            tvName.setPadding(10, 10, 10, 10);
            newRow.addView(tvName);  
        }
        table.addView(newRow);          
    }
    return fragmetLayout;
}

更新:

我的 ViewPagerActivity 布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<TabHost
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_below="@+id/imageView3" >

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0"/>

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="1" >
        </android.support.v4.view.ViewPager>

         <TabWidget
            android:id="@android:id/tabs"
            android:orientation="horizontal"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</TabHost>

 <ImageView
    android:id="@+id/imageView3"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="-3dp"
    android:background="@drawable/login_scr_top_bar"
    android:contentDescription="@drawable/login_scr_top_bar" />

<TextView
    android:id="@+id/tvReportName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="top|left"
    android:paddingLeft="15dp"
    android:paddingTop="13dp"
    android:text="@string/report_tabs"
    android:textColor="@color/my_black"
    android:textSize="18sp"
    android:textStyle="bold" />

<LinearLayout
    android:id="@+id/llTabsButtonsContainer"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:gravity="center_horizontal"
    android:orientation="horizontal"
    android:paddingBottom="5dp"
    android:paddingTop="5dp" > 
</LinearLayout>

<TextView
    android:id="@+id/tvReportTitle"
    android:layout_width="wrap_content"
    android:layout_height="20dp"
    android:layout_alignBaseline="@+id/tvReportName"
    android:layout_alignBottom="@+id/tvReportName"
    android:layout_toLeftOf="@+id/bBackToParameters"
    android:layout_toRightOf="@+id/tvReportName"
    android:text="TextView"
    android:textSize="18sp" />

<Button
    android:id="@+id/bBackToParameters"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/tvReportTitle"
    android:layout_marginRight="10dp"
    android:layout_alignParentRight="true"
    android:background="@drawable/button_back_to_parameters_selector"
    android:clickable="true"
    android:onClick="backToParametersButtonOnClick"
    android:padding="3dp"
    android:text="@string/back_to_parameters"
    android:textColor="@color/my_white"
    android:textStyle="bold" />

</RelativeLayout>

和我的 GridFramgnet 布局:

<?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" >

<LinearLayout
android:id="@+id/llParametersContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
</LinearLayout>

<TextView 
    android:id="@+id/tvTabName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" 
    android:textColor="@color/my_black"
    android:textStyle="bold"
    android:textSize="18sp"
    android:layout_marginLeft="10dp"
    android:text="It a test string for report Name"/>

    <ScrollView 
    android:id="@+id/layout" 
    android:layout_height="match_parent"         
    android:scrollbars="horizontal|vertical" 
    android:layout_width="match_parent"     
    android:layout_marginTop="5dip"     
    android:scrollbarStyle="outsideInset"
    android:fillViewport="true"> 

    <HorizontalScrollView 
        android:id="@+id/horizontalView" 
        android:layout_height="wrap_content"     
        android:scrollbars="horizontal|vertical" 
        android:layout_width="wrap_content"     
        android:layout_marginTop="5dip">

        <TableLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/tlGridTable" >   
        </TableLayout>
    </HorizontalScrollView>
   </ScrollView>
 </LinearLayout>

问题 这 3 个 Fragments 加载大约需要 10 秒，因此用户在 Activity 之前黑屏 10 秒实际加载。我怎样才能避免呢？在 AsyncTask 中运行所有填充表的过程将使我的 ViewPager Activity 加载得更快？甚至可以做到吗？

更新:大部分时间都花在填充/创建 TableLayout 上。如果从服务器接收到大量数据，则需要创建大量 TextView 并将它们设置在 TableLayout 中。

更新#2:好吧，我已经解决了这个问题，因为据我了解我的需求(整个 View 的水平和垂直滚动)我必须使用 TableLayout，所以我需要等待加载它的时间。但我需要找到一种方法来加载 fragment 中的数据，至少让用户知道正在填充数据(显示适当的 Dialog)。在开始 fragment 初始化之前，我试图在 ViewPager 的 onCreate 中放置一个对话框，但由于某种原因它没有显示，我只看到黑屏，直到 fragment 被加载。

更新:

请引用上一个问题，因为我知道无法修复加载时间:

问题:有没有办法创建一个几乎为空的 fragment (每个 fragment 只有一个单独的标题)的 ViewPager，将它们呈现给用户，然后在 Activity 已经加载并可见(而不是黑色显示屏幕)，显示一个 Dialog 并在显示该对话框时填充 fragment ？

如有任何帮助，我们将不胜感激。

谢谢。

Answer 1

This for 3 Fragments takes about 10 seconds to load, so the user get a black screen for 10 second before the Activity is actually loaded.

原因是您在布局中使用的小部件数量加上 Activity 的 View 层次结构的深度。从你发布的内容来看，你有这样的东西:

Possible wrapper for ViewPager in the Activity -> ViewPager -> At least a ScrollView(as you say something about scrolling vertically and horizontally) -> Linearlayout -> TableLayout -> TableRow -> content of TableRow

深度为 7(如果我没记错的话，支持 fragment 框架还会在中间插入一些 View )。这对性能非常不利。您在单个 Fragment 中还有很多小部件(假设那些 for 循环最多运行 10 次迭代，否则它真的很糟糕)并考虑到第二个 fragment 也将加载其 View ，您可以看到这将再次影响性能。

发布您当前的布局以查看它们是否无法优化会很有帮助。

您可以对当前代码进行一些小的改进，但这不会帮助您像您应该的那样从 10 秒减少到最多 1 秒:

这段代码没有意义:

if (container == null) {
    return null;
}

我不知道这是做什么的:

SGRaportManagerAppObj.getInstance().parametersRepository.getParametersRepository()

但看看你是否不创建无用的对象(那是单例吗？)。不要将它放在 for 循环中，因为它每次都会运行，使用普通的 for 以避免使用 Iterator:

final int count = SGRaportManagerAppObj.getInstance().parametersRepository.getParametersRepository().size();
for (int i = 0; i < count; i++) {
     final Parameter parameter = SGRaportManagerAppObj.getInstance().parametersRepository.getParametersRepository().get(i);
     // ... rest of code

您应该在其他 for 循环中执行相同的操作。

在 for 循环之外检索那些资源(颜色和可绘制对象)，在循环中只将它们分配给 View 。

编辑:您的布局非常深， View 太多，因此性能会很差。克服这个问题的唯一方法是使用回收其 View 的小部件(我知道你说的)。备选方案是:

• 在后台线程上创建这些 View (我不会这样做，因为风险很大)
• 您可以修改 fragment 以简单地在 onCreateView 中扩充布局并返回并显示正在加载的 ProgressDialog。 Fragment 可见后，您将开始分块创建 Fragment 的真实 View ，最后将其附加到 fragment 。这对用户体验非常不利。

当您使用 ViewPager 时，将有额外的工作来使页面切换之间的事情正常进行。也许您可以重新考虑当前的设置。