如何在 Android 水平滚动图像并从用户那里获取输入?

How to Scroll Image Horizontally in Android and Get Input From User?

我正在开发相机应用程序,我的图像的数字从 1 到 35 我想实现以下结构来控制缩放功能,但我陷入了用户界面实现。

应用程序要求是,用户可以从左到右或从右到左滚动图像,select 图像中的一个数字,这样我就可以使用该数字并设置缩放。

如何滚动图像并获取用户的输入?

是否有可用的库?

查看这个名为 Horizo​​ntal Picker 的库 -> https://github.com/blazsolar/HorizontalPicker

您可以轻松地将标签从 "Item " 更改为您想要的索引

将图像裁剪成您想要显示的大小并在您想要的位置居中,注册以在图像视图上拖动事件,找出用户滚动了多少并根据该值调整裁剪中心。计算用户必须滚动多少才能更改您的号码并相应地更改 int 值。

查看 https://developer.android.com/training/gestures/scale.html 了解有关处理拖动事件的更多信息。

如果你还需要的话,我今晚回家后会post编码


** 我无法添加图像,因为我最近(重新)开始使用堆栈溢出,请参阅下面 link 中的图像以获取 [A]、[B]...** http://i.stack.imgur.com/9b7kg.png

解释:

假设您有一个像 [A] 这样的图像,并且您想要实现自定义滚动。 理论上,将它分成[B]中的部分。我在 imageview 上实现滚动的方法是从图像中创建一个位图,只覆盖它的一部分(对我来说,图像大小为 5*180x 180,我希望位图显示为 3*180 x 180,所以它最多只能覆盖3个框(参考[C])。然后我会在activity中添加一个OnTouchListener并监听imageView上的触摸,当imageView被拖动时,注册差异并创建一个新的相应地调整图像[D],确保新的位图图像不会失焦。请看下面我的实现以供参考。

实施

我的布局文件

    <TextView android:text="@string/hello_world" android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentStart="true"
        android:textAlignment="center"
        android:id="@+id/textView" />

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="fitXY"
        android:id="@+id/imageView"
        android:layout_alignParentStart="true"
        android:layout_alignEnd="@+id/textView"
        android:layout_alignParentBottom="true" />

</RelativeLayout>

我的Activity

// register as View.OnTouchListener to recieve updates when an object 
// registered to emit the touch event gets touched 
public class MainActivity extends Activity implements View.OnTouchListener {

    static final int  SCROLLER_WIDTH = 180*3;
    static final int SCROLLER_HEIGHT = 180;

    ImageView imageView;  // the imageView to display the rendered image
    Bitmap scrollerImage; // the original, uncut, image
    TextView textView;    // textView to display current indicator
    int scrollerStartPos = 0; // where to start cropping from
    int scrollerValue = 1;  // what value is currently indicated
    float previousX = 0;  // previous X location, used to calculate difference in pixels scrolled over


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

        // get the image view we want
        imageView = (ImageView) findViewById(R.id.imageView);

        // set the touch listener on the image
        imageView.setOnTouchListener(this);

        // get the text 
        textView = (TextView) findViewById(R.id.textView);

        // grab the uncut original image
        scrollerImage = BitmapFactory.decodeResource(getResources(), R.drawable.img1);

        // render the image
        RenderImage();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    /**
     * this method will render the part of the image that should be 
     * displayed, it also calculates the scroller value
     */
    private void RenderImage()
    {
        // create the cropped version we want to show and render it
        Bitmap renderImg = Bitmap.createBitmap(scrollerImage, scrollerStartPos,0,SCROLLER_WIDTH, SCROLLER_HEIGHT);
        // set imageView to be the bitmap
        imageView.setImageBitmap(renderImg);

        // update scroller value
        if (scrollerStartPos < 180*2)
            scrollerValue = 1;
        else if (scrollerStartPos < 180*4)
            scrollerValue = 2;
        else
            scrollerValue = 3;

        // render scroller value on the text
        textView.setText("The scroller value is: " + scrollerValue);
    }

    /**
     * called when imageView is touched
     */
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        // the user just touched the imageView, record the x location
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            previousX = (int) event.getRawX();
        }
        // the user is moving over (scrolling), act accordingly!
        else if (event.getAction() == MotionEvent.ACTION_MOVE) {
            float x = event.getRawX();

            // move start position accordingly
            scrollerStartPos -= x - previousX;

            // make sure scroller is within range
            scrollerStartPos = Math.max(scrollerStartPos, 0);
            scrollerStartPos = Math.min(scrollerStartPos, scrollerImage.getWidth() - SCROLLER_WIDTH);

            // update the previous x value
            previousX = x;

            // update image
            RenderImage();
        }
        return true;
    }
}