Подтвердить что ты не робот

Интерактивная область изображения

Я проектирую GUI-пульт дистанционного управления, но вместо того, чтобы создавать отдельные кнопки для каждой удаленной кнопки, я хочу получить полное готовое удаленное изображение и установить определенные части его кликов. есть ли способ, а не событие движения для этого?

4b9b3361

Ответ 1

У меня есть 2 решения для вашего требования. В обоих случаях изображение остается кликабельным, но вы можете получить информацию о области щелчка.

Решение 1:

вы можете замаскировать изображение и получить пиксель цвет того, что находится под изображением. В конечном итоге вы можете узнать, в какой области щелкнули.

здесь, всякий раз, когда происходит щелчок, вы можете проверить цвет пикселя background image и сопоставить его с предопределенным цветом, чтобы знать, в какой области щелкнули.

Изображение переднего плана: Foreground image

Фоновое изображение: Background image

Доступная площадь: Representing clickable area

Все еще запутано?

Справка: Я хотел бы предложить вам пройти этот учебник.

Решение 2:

вы можете сопоставить свое изображение с координатами и, соответственно, вы можете получить информацию об области, на которую была нажата кнопка.

Пример: MappedImage с координатами

если вы не знаете о координатах, вы можете создать свое mappedimage из здесь

координаты для Канзаса будут выглядеть примерно так,

        <area shape="poly" coords="243,162,318,162,325,172,325,196,244,196" id="@+id/area14" name = "Kansas"/>

MappedImage with co-ordinates

Справка: Посмотрите Картирование картинок Android.

Надеюсь, это будет полезно!

Ответ 2

Вы все еще можете использовать кнопки.

Вы можете поместить их поверх своего изображения в правильные места и сделать их невидимыми.

В XML

<Button android:visibility="invisible"/>

или

Button mybutton = (Button) v1;
mybutton.setVisibility(View.INVISIBLE);

Ответ 3

У меня были те же проблемы, и я решил это с помощью библиотеки "PhotoView" , где вы можете слушать

onPhotoTap(View view, float x, float y){} 

и проверьте, находится ли вкладка внутри области вашего изображения, а затем выполните определенные задачи.

Я создал библиотеку, чтобы помочь другим разработчикам реализовать такую ​​функциональность намного быстрее. Это на Github: ClickableAreasImages

Эта библиотека позволяет вам определять кликируемые области изображения, связывать с ними объекты и прослушивать события касания в этой области.

Как использовать библиотеку:

public class MainActivity extends AppCompatActivity implements OnClickableAreaClickedListener {

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

        // Add image
        ImageView image = (ImageView) findViewById(R.id.imageView);
        image.setImageResource(R.drawable.simpsons);

        // Create your image
        ClickableAreasImage clickableAreasImage = new ClickableAreasImage(new PhotoViewAttacher(image), this);

        // Initialize your clickable area list
        List<ClickableArea> clickableAreas = new ArrayList<>();

        // Define your clickable areas
        // parameter values (pixels): (x coordinate, y coordinate, width, height) and assign an object to it
        clickableAreas.add(new ClickableArea(500, 200, 125, 200, new Character("Homer", "Simpson")));
        clickableAreas.add(new ClickableArea(600, 440, 130, 160, new Character("Bart", "Simpson")));
    }

    // Listen for touches on your images:
    @Override
    public void onClickableAreaTouched(Object item) {
        if (item instanceof Character) {
            String text = ((Character) item).getFirstName() + " " + ((Character) item).getLastName();
            Toast.makeText(this, text, Toast.LENGTH_SHORT).show();
        }
    }
...
}

Ответ 4

Улучшение ответа @sealz, вот мой ответ:

<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
    <LinearLayout 
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerInParent="true"
        android:layout_alignTop="@+id/mail"
        android:layout_alignBottom="@+id/mail"
        >
        <Button
            android:id="@+id/leftMail"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight=".5"
            android:background="@android:color/transparent"
            />
        <Button
            android:id="@+id/rightMail"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight=".5"
            android:background="@android:color/transparent"    
            />
        </LinearLayout>
    <ImageView 
       android:id="@+id/mail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@drawable/mail1600x600"
        android:layout_centerInParent="true"
        />
</RelativeLayout>