CN-116311329-B - Walk-through method, walk-through device, electronic equipment and computer readable storage medium

CN116311329BCN 116311329 BCN116311329 BCN 116311329BCN-116311329-B

Abstract

The application discloses a walking method, a walking device, electronic equipment and a computer readable storage medium, wherein the walking method comprises the steps of obtaining a design draft picture; determining a picture to be checked corresponding to the design manuscript picture, wherein the picture to be checked is an interface screenshot when an interface to be checked is displayed on a display device, the interface to be checked is developed based on the design manuscript picture, comparing color information of each pixel point in the picture to be checked with that of a pixel point at a corresponding position in the design manuscript picture to obtain color difference information corresponding to each pixel point, and determining integral difference information of the picture to be checked and the design manuscript picture according to each color difference information. According to the scheme provided by the application, more accurate visual inspection can be performed on the interface to be inspected through the electronic equipment, and the manpower is liberated, so that the inspection speed is higher and the efficiency is higher.

Inventors

XU JIAN
YU HONGKUN
SHI TIANYANG
Duan Yinglin
WU JIAJIA
LIU BAI
ZHOU FENG
FAN CHANGJIE

Assignees

网易（杭州）网络有限公司

Dates

Publication Date: 20260512
Application Date: 20220907

Claims (16)

1. A walk-through method, the method comprising: obtaining a design draft picture; determining a picture to be checked corresponding to the design manuscript picture, wherein the picture to be checked is an interface screenshot when an interface to be checked is displayed on a display device, and the interface to be checked is developed based on the design manuscript picture; Judging whether the number of pixels in the width direction of the picture to be checked is the same as that of the picture of the design manuscript, and comparing color information of each pixel in the picture to be checked with that of the pixel at the corresponding position in the picture of the design manuscript to obtain color difference information corresponding to each pixel when the number of pixels in the width direction of the picture to be checked is the same as that of the picture of the design manuscript; determining overall difference information of the picture to be checked and the design draft picture according to the color difference information; The comparing the color information of each pixel point in the picture to be checked with the pixel point at the corresponding position in the design draft picture comprises the following steps: If the number of pixels in the height direction of the picture to be inspected is different from that of the picture of the design draft, pixel interception is carried out on a first picture in the height direction so that the number of pixels in the height direction of the intercepted picture is the same as that of pixels in a second picture, wherein the first picture is a picture with more pixels in the height direction in the picture to be inspected and the picture of the design draft, and the second picture is a picture except the first picture in the picture to be inspected and the picture of the design draft; comparing color information of each pixel point in the intercepted picture with that of the corresponding position of the second picture; if the number of the pixel points of the picture to be checked is the same as that of the pixel points of the design draft picture in the height direction, comparing the color information of each pixel point in the picture to be checked with the color information of the pixel point at the corresponding position in the design draft picture; the pixel interception of the first picture in the height direction comprises the following steps: pixel clipping is performed from the bottom and/or top of the first picture in the height direction.
2. The method of claim 1, wherein the color information includes respective channel values of a color space to which the pixel points belong, and the color difference information includes a difference value of the respective channel values.
3. The method of claim 2, wherein the color space comprises base color channels and transparency channels, the color information comprises base color channel values, transparency channel values, and the color difference information comprises a difference between each base color channel value, a difference between the transparency channel values.
4. A method according to claim 3, wherein before said determining the overall difference information of the picture to be inspected and the design draft picture from each of the color difference information, the method further comprises: determining the color difference degree corresponding to each pixel point of the picture to be checked according to each piece of color difference information; the determining the overall difference information of the picture to be inspected and the design draft picture according to the color difference information comprises the following steps: And determining the overall difference degree of the picture to be checked and the design draft picture according to the color difference degree, and determining the overall difference degree as the overall difference information of the picture to be checked and the design draft picture.
5. The method according to claim 4, wherein determining the degree of color difference corresponding to each pixel of the picture to be inspected according to each color difference information includes: determining the maximum difference value between the two pixel points with the largest color difference according to the maximum difference value of each channel between the two pixel points with the largest color difference; and determining the color difference degree corresponding to each pixel point of the picture to be checked according to the difference value of each channel value in the color difference information and the maximum difference value.
6. The method of claim 5, wherein prior to determining the maximum difference value between the two pixels having the largest color difference based on the maximum difference value of each channel between the two pixels having the largest color difference, the method further comprises: acquiring a value range of a target channel in the color space, wherein the target channel is a channel with the largest value range in all channels corresponding to the color space; Determining the weighted value of the channels except the target channel in the color space based on a weighted principle according to the value range of the target channel, wherein the weighted principle is that the value range of the channels except the target channel in the color space is multiplied by the weighted value and then is the same as the value range of the target channel; The determining the maximum difference value between the two pixel points with the largest color difference according to the maximum difference value of each channel between the two pixel points with the largest color difference comprises the following steps: Determining the sum of maximum weighted difference values of all channels between two pixel points with the maximum color difference as the maximum difference value between the two pixel points with the maximum color difference, wherein the maximum weighted difference value is the product of the maximum difference value corresponding to the channel and the weighted value of the channel; The determining the color difference degree corresponding to each pixel point of the picture to be checked according to the difference value of each channel value in the color difference information and the maximum difference value comprises the following steps: And determining the ratio of the sum of the weighted differences corresponding to each channel in the color difference information to the maximum difference value as the degree of color difference corresponding to each pixel point of the picture to be checked, wherein the weighted difference is the product of the channel difference corresponding to the channel and the weighted value of the channel.
7. The method of claim 5, wherein the method further comprises: Determining a difference region labeling chart according to the color difference degree corresponding to each pixel point of the picture to be checked or And determining a similarity thermodynamic diagram according to the color difference degree corresponding to each pixel point of the picture to be checked.
8. The method according to claim 7, wherein the determining a difference region label according to color difference information corresponding to each pixel of the picture to be inspected includes: screening out pixel points with different color difference degrees from zero in the picture to be checked as difference points; Determining a region formed by adjacent difference points in the difference points as a difference region; And carrying out region labeling in the picture to be inspected according to the difference region to obtain a difference region labeling picture.
9. The method according to claim 8, wherein the performing region labeling in the picture to be inspected according to the difference region to obtain a difference region labeling chart includes: Calculating the width, the height, the initial horizontal position and the initial vertical position of each difference region, and marking rectangular regions matched with the width, the height, the initial horizontal position and the initial vertical position in the picture to be inspected to obtain a difference region marking chart; Or calculating the central position and the longest boundary connecting line of the difference region, and obtaining a difference region annotation graph by taking the central position as a circle center and the longest boundary connecting line as a diameter annotation circular region in the picture to be inspected; Or marking the difference region in the picture to be inspected to obtain a difference region marking chart.
10. The method according to claim 9, wherein the method further comprises: And determining the overall difference degree corresponding to the difference region according to the difference degree corresponding to each difference point in the difference region.
11. The method according to claim 8, wherein the determining the similarity thermodynamic diagram according to the degree of color difference corresponding to each pixel of the picture to be inspected comprises: determining thermodynamic diagram color values of all pixel points according to the color difference degrees corresponding to the pixel points in the picture to be checked; and determining a similarity thermodynamic diagram according to the thermodynamic diagram color values of the pixel points.
12. The method according to claim 11, wherein the determining the thermodynamic color value of each pixel point in the picture to be inspected according to the color difference degree corresponding to each pixel point comprises: obtaining a first preset color value corresponding to the difference degree of 0 and a second preset color value corresponding to the difference degree of 100% in the similarity thermodynamic diagram; And determining thermodynamic color values of all pixel points in the picture to be checked based on a color determination principle, wherein the color determination principle is that the degree of color difference corresponding to the pixel points is proportional to a first difference value and inversely proportional to a second difference value, the first difference value is a difference value between the thermodynamic color values of the pixel points and the first preset color values, and the second difference value is a difference value between the thermodynamic color values of the pixel points and the second preset color values.
13. The method of claim 12, wherein determining thermodynamic color values for each pixel in the picture to be inspected based on color determination principles comprises: And determining thermodynamic color values of all pixel points in the picture to be checked by using the following formula: r Wherein, the For the thermodynamic color values, For said second preset color value, The first preset color value is set to be a color value, To the extent of the color difference.
14. A walkthrough device, the device comprising: The acquisition unit is used for acquiring the design draft picture; the first determining unit is used for determining a picture to be checked corresponding to the design manuscript picture, wherein the picture to be checked is an interface screenshot when an interface to be checked is displayed on a display device, and the interface to be checked is developed based on the design manuscript picture; The comparison unit is used for judging whether the number of the pixels in the width direction of the picture to be checked is the same as that of the pixels in the width direction of the design manuscript picture, and when the number of the pixels in the width direction of the picture to be checked is detected to be the same, comparing the color information of each pixel in the picture to be checked with the color information of the pixel at the corresponding position in the design manuscript picture to obtain the color difference information corresponding to each pixel; A second determining unit configured to determine overall difference information of the picture to be inspected and the design draft picture according to each of the color difference information; The comparing the color information of each pixel point in the picture to be checked with the pixel point at the corresponding position in the design draft picture comprises the following steps: If the number of pixels in the height direction of the picture to be inspected is different from that of the picture of the design draft, pixel interception is carried out on a first picture in the height direction so that the number of pixels in the height direction of the intercepted picture is the same as that of pixels in a second picture, wherein the first picture is a picture with more pixels in the height direction in the picture to be inspected and the picture of the design draft, and the second picture is a picture except the first picture in the picture to be inspected and the picture of the design draft; comparing color information of each pixel point in the intercepted picture with that of the corresponding position of the second picture; if the number of the pixel points of the picture to be checked is the same as that of the pixel points of the design draft picture in the height direction, comparing the color information of each pixel point in the picture to be checked with the color information of the pixel point at the corresponding position in the design draft picture; the pixel interception of the first picture in the height direction comprises the following steps: pixel clipping is performed from the bottom and/or top of the first picture in the height direction.
15. An electronic device, comprising: Processor, and A memory for storing a data processing program, the electronic device being powered on and executing the program by the processor, for performing the method of any of claims 1-13.
16. A computer readable storage medium, characterized in that a data processing program is stored, which program is run by a processor, performing the method according to any of claims 1-13.

Description

Walk-through method, walk-through device, electronic equipment and computer readable storage medium Technical Field The embodiment of the application relates to the technical field of computers, in particular to a walking method, a walking device, electronic equipment and a computer readable storage medium. Background With the continuous development of computer technology, the development and updating speed of websites or application programs are faster and faster, in order to ensure that an Interface delivered by a developer is consistent with a design draft picture of a designer in an Interface design (UI) process, usually after the development of websites or application programs is completed, the designer needs to check and accept a picture to be checked delivered by the developer, that is, perform walking check (i.e., visual walking check) on the Interface, and the developer adjusts the Interface according to the walking check result, so that the developed Interface is consistent with the design draft picture. In the related art, an interface to be inspected is usually displayed, an inspection person compares the displayed interface to be inspected with a design manuscript picture by naked eyes, and then a comparison result is recorded to obtain a walk inspection report. However, the manual visual inspection method belongs to a rough inspection method, and because evaluation standards among people have differences, inspection results of different inspection staff on the same interface are often different, and in addition, manual inspection and accommodation are easily influenced by subjective factors of people, so that the inspection accuracy is lower. Disclosure of Invention The application provides a walking inspection method, a walking inspection device, electronic equipment and a computer readable storage medium, which can carry out more accurate visual walking inspection on an interface to be inspected through the electronic equipment. The specific scheme is as follows. In a first aspect, an embodiment of the present application provides a walk-through method, including obtaining a design draft picture; determining a picture to be checked corresponding to the design manuscript picture, wherein the picture to be checked is an interface screenshot when an interface to be checked is displayed on a display device, and the interface to be checked is developed based on the design manuscript picture; comparing the color information of each pixel point in the picture to be checked with the color information of the pixel point at the corresponding position in the design draft picture to obtain the color difference information corresponding to each pixel point; and determining the overall difference information of the picture to be checked and the design draft picture according to the color difference information. Optionally, the comparing the color information of each pixel point in the picture to be checked with the pixel point at the corresponding position in the design draft picture includes: When the number of pixel points of the picture to be checked and the design draft picture in the width direction is detected to be the same, comparing the color information of each pixel point in the picture to be checked with the pixel point at the corresponding position in the design draft picture. Optionally, the comparing the color information of each pixel point in the picture to be checked with the pixel point at the corresponding position in the design draft picture includes: If the number of pixels in the height direction of the picture to be inspected is different from that of the picture of the design draft, pixel interception is carried out on a first picture in the height direction so that the number of pixels in the height direction of the intercepted picture is the same as that of pixels in a second picture, wherein the first picture is a picture with more pixels in the height direction in the picture to be inspected and the picture of the design draft, and the second picture is a picture except the first picture in the picture to be inspected and the picture of the design draft; comparing color information of each pixel point in the intercepted picture with that of a corresponding position in the second picture; And if the number of the pixel points of the picture to be checked is the same as that of the pixel points of the design draft picture in the height direction, comparing the color information of each pixel point in the picture to be checked with the color information of the pixel point at the corresponding position in the design draft picture. Optionally, the capturing pixels of the first picture in the height direction includes: pixel clipping is performed from the bottom and/or top of the first picture in the height direction. Optionally, the color information includes each channel value of a color space to which the pixel point belongs, and the color difference information includes a differ