Question

我正在尝试制作一个应用，在该应用中，框的背景颜色出现在屏幕中间时会发生变化。我能够在javascript中实现这一点，但是在android java中找不到任何好的方法。意味着我无法在Android Java中找到与$this.scrollY，$this.innerHeight，box.offsetTop类似的方法来构造相似的逻辑。因此，请协助我实现这一目标。

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    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"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="75dp"
        android:background="@color/skyblue"/>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="80dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp">

        <LinearLayout
            android:id="@+id/content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
        </LinearLayout>
    </ScrollView>
</android.support.constraint.ConstraintLayout>

MainActivity.java:

package com.example.test;

import android.support.v7.app.AppCompatActivity;
import android.os.*;
import android.widget.*;

public class MainActivity extends AppCompatActivity {

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

        LinearLayout content = findViewById(R.id.content);
        for (int x=0;x<25;x++) {
            RelativeLayout element = new RelativeLayout(this);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 400);
            params.setMargins(0, 0, 0, 50);
            element.setLayoutParams(params);
            element.setBackgroundResource(R.color.green);
            content.addView(element);
        }
    }
}

MY JAVASCRIPT WORKING EXAMPLE:

window.onbeforeunload = function () {
    this.scrollTo(0, 0);
}
var content = document.getElementById("content");
for (var x=0;x<25;x++) {
    var box = document.createElement("DIV");
    box.id = "box";
    content.appendChild(box);
}
content.children[0].style.backgroundColor = "#008100";
var current_box = content.children[0],
    scroll_timeout = undefined;

window.addEventListener("scroll", function () {
    var $this = this;
    window.clearTimeout(scroll_timeout);
    scroll_timeout = setTimeout(function() {
        var middle_line = $this.scrollY + ($this.innerHeight/2);
        for (var y=0;y<content.querySelectorAll("#box").length;y++) {
            var box = content.children[y];
            if ((box.offsetTop) < middle_line && (box.offsetTop + box.clientHeight + 50) > middle_line) {
                if (box != current_box) {
                    current_box.style.backgroundColor = "#6CABF7";
                    current_box = box;
                    current_box.style.backgroundColor = "#008100";
                }
                break;
            }
        }
    }, 100);
});

body {
    margin: 0;
}
#content {
    width: 60%;
    height: 100%;
    margin: 0% 20% 0% 20%;
}
#box {
    width: 100%;
    height: 500px;
    background-color: #6CABF7;
    overflow: hidden;
    margin-bottom: 50px;
}

<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div id="content"></div>         
</body>
</html>

Answer 1

如果您想对滚动事件做出反应，则需要监听它们。在您的Java代码中没有看到这样的侦听器，但是您的javascript代码中有一个侦听器。

我发现了这个StackOverflow问题，相信可以为您提供帮助。

listening to scroll events horizontalscrollview android

Answer 2

选中此View.OnScrollChangeListener

您可以从此处获取X和Y滚动位置

scrollView.setOnScrollChangeListener(new View.OnScrollChangeListener() {
        @Override
        public void onScrollChange(View v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {
            //work with parameters
        }
    });

注意：仅适用于API 23。

Answer 3

我认为我做得很好，如果有人看到任何问题，请告诉我。

package com.example.test;

import android.support.v7.app.AppCompatActivity;
import android.os.*;
import android.view.*;
import android.widget.*;

public class MainActivity extends AppCompatActivity {
    LinearLayout content;
    RelativeLayout current_box;

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

        content = findViewById(R.id.content);
        for (int x=0;x<25;x++) {
            RelativeLayout element = new RelativeLayout(this);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 600);
            params.setMargins(0, 0, 0, 50);
            element.setLayoutParams(params);
            element.setBackgroundResource(R.color.skyblue);
            content.addView(element);
        }

        current_box = (RelativeLayout) content.getChildAt(0);
        current_box.setBackgroundResource(R.color.green);

        final Handler scroll_timeout = new Handler();
        ((ScrollView) content.getParent()).getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
            @Override
            public void onScrollChanged() {
                scroll_timeout.removeCallbacksAndMessages(null);
                final Runnable run_able = new Runnable() {
                    @Override
                    public void run() {
                        ScrollView scroll_view = (ScrollView) content.getParent();
                        int middle_line = 75 + scroll_view.getScrollY() + (scroll_view.getHeight()/2);
                        for (int y=0;y<content.getChildCount();y++) {
                            RelativeLayout box = (RelativeLayout) content.getChildAt(y);
                            int offsettop = 75 + (box.getHeight()*y) + ((y>1?50:0)*y);
                            if (offsettop < middle_line && (offsettop + box.getHeight()) > middle_line) {
                                current_box.setBackgroundResource(R.color.skyblue);
                                current_box = box;
                                current_box.setBackgroundResource(R.color.green);
                            }
                        }
                    }
                };
                scroll_timeout.postDelayed(run_able, 100);
            }
        });
    }
}

当框出现在屏幕中间时更改框的背景颜色

3 个答案: