0

Alright I'm trying to build an activity that has a horizontal scrollview, that the user can swipe through, to view different "pages". My train of thought is these "pages" will be views. The following is a mockup of my idea (to mess around to see if it works)

I've experimented with this as follows:

My content view is set to the the scrollview. (unsure if this is an incorrect approach)

I create the scrollview, and place a view into it as follows:

private void setupScrollView()
{
    Display display = getWindowManager().getDefaultDisplay();
    DisplayMetrics outMetrics = new DisplayMetrics ();
    display.getMetrics(outMetrics);

    float density  = getResources().getDisplayMetrics().density;
    float dpHeight = outMetrics.heightPixels / density;
    float dpWidth  = outMetrics.widthPixels / density;

    int width = (int)MeasureUtils.convertDpToPixel(dpWidth, getApplicationContext());
    int height = (int)MeasureUtils.convertDpToPixel(dpHeight, getApplicationContext());

    _scrollView = new HorizontalScrollView(getApplicationContext());
    _scrollView.setBackgroundColor(Color.CYAN);
    _scrollView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));

     Log.i("DEBUG", "Screen dp width = " + dpWidth + " screen dp height = " + dpHeight);

    TextView view = new TextView(getApplicationContext());
    view.setBackgroundColor(Color.RED);
    view.setText("TEST");

    view.setX(0); // Start at the left of the scrollview.

    view.setWidth(width); // Size it so that it fills to the right of the scrollview.

    TextView view2 = new TextView(getApplicationContext());
    view2.setBackgroundColor(Color.GREEN);
    view2.setText("TEST2");

    view2.setX(width); // Start the second "page/view" offscreen to the right where i can scroll to it

    view.setWidth(width); // Fill the screen width

    LinearLayout layout = new LinearLayout(getApplicationContext());
    layout.setBackgroundColor(Color.MAGENTA);

    layout.addView(view);

    layout.addView(view2);

    _scrollView.addView(layout);
}

The idea above is that I will see a view, that takes up the screen, representing a page. This view should be "RED" in color. I can then scroll horizontally to the right and see the second view (view2) representing the next page. This view should be "GREEN" in color. This does not happen. I end up seeing what looks like 1/3rd or 1/2 of my screen being view1, the linearlayout taking up almost the whole screen (a bit of a gap to the right edge where the CYAN from the scrollview bleeds through).

Am I approaching this the wrong way, and/or is it possible to make this work the way I'm going at it?

4

2 回答 2

1

您可能不想使用水平滚动视图来创建“页面”。尝试查看PageViewer

这会自动为您构建所有 sywpe 和膨胀逻辑。

基本上你会接到一个电话来膨胀某个页面。然后您可以在那里创建您的视图（如果您愿意，可以动态创建），然后返回要渲染的根。

于 2013-06-18T21:33:30.523 回答
1

好吧，我已经弄清楚我做错了什么，结果证明是一件非常小的事情......

完整的代码在这里：

    private void setupScrollView()
{
    Display display = getWindowManager().getDefaultDisplay();
    DisplayMetrics outMetrics = new DisplayMetrics ();
    display.getMetrics(outMetrics);

    float density  = getResources().getDisplayMetrics().density;
    float dpHeight = outMetrics.heightPixels / density;
    float dpWidth  = outMetrics.widthPixels / density;

    int width = (int)MeasureUtils.convertDpToPixel(dpWidth, getApplicationContext());
    int height = (int)MeasureUtils.convertDpToPixel(dpHeight, getApplicationContext());

    _scrollView = new HorizontalScrollView(getApplicationContext());
    _scrollView.setBackgroundColor(Color.CYAN);
    _scrollView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));

    Log.i("DEBUG", "Screen dp width = " + dpWidth + " screen dp height = " + dpHeight);

    TextView view = new TextView(getApplicationContext());
    view.setBackgroundColor(Color.RED);
    view.setText("TEST");

    view.setX(0);

    view.setWidth(width);
    view.setHeight(height - 50);

    TextView view2 = new TextView(getApplicationContext());
    view2.setBackgroundColor(Color.GREEN);
    view2.setText("TEST2");

    view2.setX(0);

    view2.setWidth(width);
    view2.setHeight(height - 50);

    LinearLayout layout = new LinearLayout(getApplicationContext());
    layout.setBackgroundColor(Color.MAGENTA);

    layout.addView(view);

    layout.addView(view2);

    _scrollView.addView(layout);


}

正如我所做的那样，这以编程方式创建了一个水平滚动视图，但问题是我将第二个视图设置为“宽度”，而它应该设置为“0”，如下所示：

view2.setX(0);

有了这个，我得到了 2 个类似于滚动视图中的页面的“视图”，我可以在其中滑动。每一个都占据了整个页面。

讨厌关闭代码，这是我错过的一个简单修复：|

希望这可以帮助其他尝试这样做的人。我将按照 Frank 的建议研究 PageViewer。

于 2013-06-18T21:41:29.540 回答